@charset "utf-8";

/**--------------------------------------
	01.BASIC_STRUCTURE
---------------------------------------**/
@media screen and (max-width: 414px) {

    input[type=text], input[type=password] {
        padding:0;
    }
    textarea {
        margin:10px;
        width:90%;
    }

    #container {
        width:92%;
/*        width: 95%;*/
        text-align: left;
        padding: 0 5px;
    }

    #contents {
        clear: both;
        width: 95%;
    }
    div#foot-contain{
        width:100%;
        word-break:break-all;
    }

    header h1 {
        width: 100%;
    }
    
    .headerHeight1 {
        height: 65px;
    }

    .headerHeight2 {
        height: 105px;
    }

    img#imgHeaderTitle_ld {
        max-width: 250px;
        max-height: 33px;
    }

    img#imgHeaderTitle_sens {
        max-width: 300px;
        max-height: 32px;
    }

    nav {
        height: auto;
    }

    div#nav-box {
        width: 100%;
        padding-top: 5px;
    }

    div#nav-box ul.user_info {
        position: static;
    }

    div#nav-box ul.user_info li {
        height: auto;
        float: none;
        padding:0px;
    }

    .info-area {
        position:initial;
        margin-left:25px;
    }
    .step {
        display:none;
    }
    .brloginname:before{
        content:"\A";
        white-space: pre;
    }

    /*ボタンリスト*/
    ul.btnlist.clearfix li{
        margin:0;
    }


    /*ログインフォーム*/
    #login {
        width: 100%;
        margin:0px;
        border: 1px solid #DDDDDD;
        background: #FFFFFF;
        box-shadow: 0px 0px 3px #DDD;
        -moz-box-shadow: 0px 0px 3px #DDD;
        -webkit-box-shadow: 0px 0px 3px #DDD;
    }
    #login.mw340 {
        width:340px;
    }
    #newmember {
        width: 100%;
        margin-top:10px;
        margin-left:0px;
    }
    div.newentryWrap {
        width:100%;
    }
    #attention {
        width: 100%;
        margin-left: 0px;
    }

    #attention_items {
        width: 95%;
    }

    div.pnlNewMemberButton.mw94P {
        width:94%;
        min-height:0px;
    }
    div.pnlNewMemberButton.mw94P ul.btnlist {
        margin:0;
    }
    div.pnlNewMemberButton.mw94P ul.btnlist li.btnnewentry {
        margin:0;
    }
    div.pnlEntryLoginButton.mw94P {
        width:94%;
        min-height:0px;
        margin-left:0;
    }
    div.pnlEntryLoginButton.mw94P ul.btnlist {
        margin:0;
    }
    div.pnlEntryLoginButton.mw94P ul.btnlist li.btnnewentry {
        margin:0;
    }
    .word_break {
        word-break: break-all;
    }
    .mfloat-none {
        float:none;
    }
    h1 {
        width: 360px;
        height: 50px;
    }
    div.mhauto {
        height: auto;
    }

    .ld table.mw310 th.mwauto, .sens table.mw310 th.mwauto {
        width: auto;
    }
    /*横幅*/
    .mw140 {
        width: 140px;
    }

    .mw200 {
        width: 200px;
    }

    .mw225 {
        width: 225px;
    }

    .mw240 {
        width: 240px;
    }

    .mw280 {
        width: 280px;
    }

    .mw290 {
        width: 290px;
    }
    .mw310 {
        width: 310px;
    }
    .mw340 {
        width:340px;
    }
    .mw360 {
        width: 360px;
    }
    .mwauto {
        width:auto;
    }
    .mw40P {
        width:40%;
    }
    .mw60P {
        width: 60%;
    }
    .mw90P {
        width: 90%;
    }
    .mw94P {
        width:94%;
    }
    .mw95P {
        width:95%;
    }
    .imw96P {
        width:96% !important;
    }
    .imw97P {
        width:97% !important;
    }
    .mw100P {
        width:100%;
    }
    .mw300P {
        width:300%;
    }

    .mw-ini {
        width:initial;
    }

    /*テーブル*/
    .ld table, .sens table {
        width: 100%;
        margin: 0;
    }
    .ld table td, .sens table td {
        border-bottom: 2px solid #EEE;
        width: 100%;
        display:block;
        /*padding: 10px 0px;*/
    }

    .ld table td.pad0, .sens table td.pad0 {
        padding: 0px 0px;
    }
    .ld table th.mw96P, .sens table th.mw96P {
        width: 96%;
    }

    .ld table td.mw98P, .sens table td.mw98P {
        width: 98%;
    }
    .ld table td.mw96P, .sens table td.mw96P {
        width: 96%;
    }

    .ld table th, .sens table th {
        display:block;
        /*padding:10px 0px;*/
        width:100%;
    }

    /* 自宅、勤務先 グループ見出し */
    .ld table th.w114 {
        background: #c5fbdf;
        font-size: 110%;
        border-left: 6px solid #6be0a6;
        width: calc(100% - 6px);
    }
    .sens table th.w114 {
        background: #FFDAB9;
        font-size: 110%;
        border-left: 6px solid #FFA07A;
        width: calc(100% - 6px);
    }

    .ld table th.head, .sens table th.head {
        /*padding:0;*/
        width: calc(100% - 40px);
    }


    .ld tale#tblLoginId.mw310 {
        width:310px;
    }
    .ld table.mw310 {
        width: 310px;
    }

    .ld table.mw310 th.mw290{
        width: 290px;
    }
    table.base th, table.base td {
        display: block;
    }
    
    table.base td.mw260 {
        width:260px;
    }
    .h_mail_reminder {
        width: auto;
    }

    .ld table.mw100P, .sens table.mw100P {
        width: 100%;
    }

        .ld table.mw290, .sens table.mw290 {
            width: 290px;
        }

        .ld table.mw310, .sens table.mw310 {
            width: 310px;
        }

            .ld table.mw310 td, .ld table.mw310 th, .sens table.mw310 td, .sens table.mw310 th {
                display: block;
            }
            .ld table.mw310 th.head,.sens table.mw310 th.head {
                padding:0px 10px;
            }

    table.registry_member table {
        width: 100%;
    }

    table.mw100P.registry_member td {
        width: 96%;
        min-height:15px;
    }
    table.mw100P.registry_member td.mw96P {
        width: 96%;
        min-height:15px;
    }
    .padding0 {
        padding:0;
    }
    .margin0 {
        margin: 0;
    }
    .margin1 {
        margin: 1px;
    }

    .margin_left0 {
        margin-left: 0px;
    }

    .margin-top10 {
        margin-top: 10px;
    }
    .imargin-top10 {
        margin-top: 10px !important;
    }

    .sens table.margin-top10 {
        margin-top: 10px;
    }

    span.radio-table label {
        width: 90%;
    }

    span.radio-table#ContentPlaceHolder1_f_main_region_rblFreeRbl input,
    span.radio-table#ContentPlaceHolder1_f_sub_region_rblFreeRbl input {
        display: inline-block;
        /*width: 13px;*/
    }

    span.radio-table#ContentPlaceHolder1_f_main_region_rblFreeRbl label,
    span.radio-table#ContentPlaceHolder1_f_sub_region_rblFreeRbl label {
        display: inline-block;
        width: calc(33% - 26px);
    }

    span.radio-table-even152 label {
        width: 90%;
    }
    span.radio-table-even148 label {
        width: 90%;
    }
    span.radio-table-even label {
        width: 90%;
    }
    table.base td.border-r-none {
        border-right:none;
    }

    th.block_th.mw260 {
        display: block;
        width: 290px;
    }

    td.block_td {
        display: block;
        width: 290px;
    }

    /*tableタグをdivタグに変更*/
    .div_table,
    .row,
    .column,
    .column:before {
        display: block;
    }

        .div_table,
        .row .column:last-child {
            border-bottom: none;
        }

    .div_table-head {
        position: absolute;
        top: -1000em;
        left: -1000em;
    }

    .row {
        border: 1px solid #eeeeee;
        margin-bottom: 10px;
    }

        .row .column:nth-child(1) {
            border-left: none;
        }

        .row .column:last-child {
            border-right: none;
        }

        /*20180216-km*/
        /*.row:last-child .column,
        .column {
            border-bottom: 1px solid #eeeeee;
            width: 297px;
            padding: 0;
        }*/
        .row:last-child .column,
        .column {
            border-bottom: 1px solid #eeeeee;
            width: 313px;
            padding: 0;
        }

            .column:before {
                font-weight: bold;
                padding-right: 20px;
                font-size: 12px;
                content: " "attr(data-label)" "; /* data-labelのテキストを//を付けて表示する  */
                background-color: #EAFFF4;
            }

    div.head {
        background-color: #359F6A;
        color: #FFF;
    }
    .sens div.head {
        background-image: linear-gradient(to bottom, #FFBF80, #D28F79);
        color: #FFF;
    }

    .div_table {
        margin: 0;
    }

    a.mdisplayblock {
        display:block;
    }
    div.modal_panel {
        width:95%;
        word-break:break-all;
    }
    .mobile_on_display {
        display:initial;
    }
    .mobile_off_display {
        display:none;
    }

    div.mw310 {
        width:310px;
    }
    div.entry_scrolly_content {
        width:330px;
    }
    div.entry_scrolly_content.mw100P {
        width:100%;
    }
    div.entry_scrolly_body10rows {
        width:100%;
        border:1px solid #EEC;
    }
    div.entry_scrolly_body10rows.mw100P {
        width:100%;
    }
    div.entry_scrolly_body10rows table.init {
        display:initial;
    }
    div.entry_scrolly_body500 {
        width:300px;
    }


  .ld table.scrolly_body, .sens table.scrolly_body {
    border-style:none;
  }
  .ld table.scrolly_body td, .sens table.scrolly_body td {
    padding:0;
    border:1px solid #eee;
    border-right:1px solid #eee;
  }
  .ld table.scrolly_body tr, .sens table.scrolly_body tr {
    margin-bottom:2em;
    display:block;
  }
  .sens table.scrolly_body td.scroll_header:before {
    content: attr(aria-label);
    display:block;
    background-color:#FFF4E8;
    border-bottom: 2px solid #F0C3B4;
    padding:0;
    font-weight:bold;
  }

  table.scrolly_body td.scroll_header:before {
    content: attr(aria-label);
    display:block;
    background-color:#EAFFF4;
    border-bottom: 2px solid #A6EBC9;
    padding:0;
    font-weight:bold;
  }
    table.tdlField thead tr.header {
        display:none;
    }
    table.tdlField tr td {
        height:auto;
        min-height:40px;
        width:100%;
        padding:0;
    }
    table.tdlField tr td:not(.not_before):before {
        min-height:20px;
        display:block;
                font-weight: bold;
                content: " "attr(data-label)" "; /* data-labelのテキストを//を付けて表示する  */
                background-color: #FFF4E8;
            }
    table.tdlField tr th.thLocal:before {
        display:block;
                font-weight: bold;
                content: " "attr(data-label)" "; /* data-labelのテキストを//を付けて表示する  */
                background-color: #FFF4E8;
            }
    table.tblPoint tbody tr.header {
        display:none;
    }
    table.tblPoint tr td.back-color:not(.not_before):before {
        background-color:#D28F79;
        color:white;
    }
    table.tblPoint tr td {
        height:auto;
        min-height:40px;
        width:100%;
        padding:0;
        text-align:left;
    }
    table.tblPoint tr td:not(.not_before):before {
        min-height:20px;
        display:block;
                font-weight: bold;
                content: " "attr(data-label)" "; /* data-labelのテキストを//を付けて表示する  */
                background-color: #FFF4E8;
    }
    .sens table.tbltotal {
        width:100%;
    }
    .sens table.tbltotal tbody tr td.no_block {
        display:initial;
        padding-right:20px;
    }
    .sens table.tbltotal tbody tr td.padding0 {
        padding:0;
    }
    .sens table.tbl_upd_picture {
        border:none;
        width:auto;
    }
    .sens table.tbl_upd_picture td{
        border-bottom:none;
        width:200px;
    }
    .sens table.tbl_upd_picture td.mw92P{
        /*width:92%;*/
    }
    .sens table.tbl_upd_picture input.mw225{
        width:225px;
    }

    /*一覧テーブル対応*/
    table.mtblpaging tr {
        display:block;
        margin-bottom:2em;
    }
    table.mtblpaging thead tr.header {
        display:none;
    }
    table.mtblpaging tr td:not(.not_before) {
        height:auto;
        min-height:40px;
        width:100%;
        padding:0;
    }
    table.mtblpaging tr td:not(.not_before):before {
        min-height:20px;
        display:block;
        font-weight: bold;
        content: " "attr(data-label)" "; /* data-labelのテキストを//を付けて表示する  */
        background-color: #EAFFF4;
    }

    .sens table.mtblpaging tr td:not(.not_before):before {
        min-height:20px;
        display:block;
        font-weight: bold;
        content: " "attr(data-label)" "; /* data-labelのテキストを//を付けて表示する  */
        background-color: #FFF4E8;
    }
    .sens table.mtblpaging.green tr td:not(.not_before):before {
        background-color: #EAFFF4;
    }



    div.upd_picture {
        margin:5px 10px 5px 5px; 
        padding:10px 15px 0px 10px;
        font-size:10px; 
        border-style:solid; 
        border-width:2px; 
        display:inline-block; 
        border-color:orange; 
        float:none;
        width:115%;
        height:auto;
    }
    div.send_picture {
        margin:5px 5px 5px 10px;
        padding:30px 15px 25px 15px; 
        font-size:10px; 
        border-style:solid; 
        border-width:2px; 
        display:inline-block; 
        border-color:blue;
        float:none;
        width:110%;
    }
    div.pct_sample_face {
        float:none;
    }
    .text-align-c {
        text-align: center;
    }
    /*↓↓↓↓ add km ↓↓↓↓*/
    #tabs ul.ui-tabs-nav {
    }


        #tabs ul.ui-tabs-nav li {
            float: left;
            width: 240px;
            height: 45px;
        }

    #tabs .ui-tabs-panel, #notabs .ui-tabs-panel {
        clear: both;
        padding: 2px;
        background: #FFFFFF;
        border: 1px solid #DDDDDD;
        box-shadow: 0px 0px 3px #DDD;
        -moz-box-shadow: 0px 0px 3px #DDD;
        -webkit-box-shadow: 0px 0px 3px #DDD;
    }

    #info-title {
        border-top: 1px solid #F48A8A;
        border-left: 1px solid #F48A8A;
        border-right: 1px solid #F48A8A;
        background: #FFC0C0;
        padding: 3px;
    }

    .info-title,
    .info-title2 {
        height: initial;
        margin-bottom: 0px;
    }

    ul.btnlist-ld, ul.btnlist-sens, ul.btnlist-comm, ul.btnlist-disable {
        margin: 0;
        width: 100%;    

    }


        ul.btnlist-ld li, ul.btnlist-disable li,ul.btnlist-sens li{
            display:block;
            width:98%;
        }
        ul.btnlist-ld li a, ul.btnlist-disable li a {
            display: block;
            float: left;
            width: 100%;
            margin: 2px 2px;
            text-align: center;
            font-size: 112%;
            color: #360;
            text-decoration: none;
        }

        ul.btnlist-sens li a {
            display: block;
            float: left;
            width: 100%;
            margin: 2px 2px;
            text-align: center;
            font-size: 112%;
            color: #960;
            text-decoration: none;
        }

        ul.btnlist-comm li a {
            display: block;
            float: left;
            width: 98%;
            margin: 2px 2px;
            text-align: center;
            font-size: 112%;
            color: #039;
            text-decoration: none;
        }

    /*↓↓↓ マイページ ↓↓↓*/
    .ld table.mypage, .sens table.mypage {
        margin: 9px;
        width: 280px;
        border-collapse: separate;
        border-spacing: 2px;
        border: 1px solid #EEE;
    }

        .ld table.mypage th {
            background: #EAFFF4;
            border-bottom: 2px solid #A6EBC9;
            width: 280px;
            display: block;
        }

        .ld table.mypage td {
            border-bottom: 2px solid #A6EBC9;
            width: 280px;
            display: block;
        }

        .sens table.mypage th {
            background: #FFF4E8;
            border-bottom: 2px solid #F0C3B4;
            width: 280px;
            display: block;
        }

        .sens table.mypage td {
            border-bottom: 2px solid #F0C3B4;
            width: 280px;
            display: block;
        }

    /*↓↓↓ 支払い方法のご案内 ↓↓↓*/
    table.banktransfer {
        border-collapse: separate;
        border: 1px solid #EEE;
        border-spacing: 1px;
        color: #000000;
        margin: 0px auto;
        width: 240px;
    }

        table.banktransfer th {
            background-color: #7BCEB8;
            height: 30px;
            line-height: 30px;
            padding: 0px 8px;
            font-weight: normal;
            border-bottom: 1px solid #EEE;
            font-size: 100%;
            display: block;
        }

        table.banktransfer td {
            height: 40px;
            padding: 0px 8px;
            border-bottom: 1px solid #EEE;
            display: block;
        }

    /*↓↓↓ ポイント申請 ↓↓↓*/
    .sens table th {
        background: #FFF4E8;
        border-bottom: 2px solid #F0C3B4;
        width: 100%;
        display: block;
    }

    .mh100 {
        height: 100px;
    }


    .sens table th.mw290{
        width: 290px;
    }

    .sens display {
        display:none;
    }

    input[type=text].mw290 {
	    width: 290px;
    }
    input[type=text].mw95P {
	    width: 95%;
    }
    /*↓↓↓お支払い状況一覧↓↓↓*/
    .mh150 {
        height: 150px;
    }

    /*↓↓↓お支払い明細↓↓↓*/
    .ld table.payment, .sens table.payment {
        width: 100%;
        margin: 0;
    }
    .ld table.payment td, .sens table.payment td {
        border-bottom: 2px solid #EEE;
        width: 100%;
        display: block;
    }
    .ld table.payment td, .sens table.payment td {
	    height:auto;
	    padding:3px 0px;
	    border-bottom:1px solid #EEE;
    }
    .ld table.payment th {
        background: #7BCEB8;
        border-bottom: 2px solid #EEEEEE;
        width: 100%;
        display: block;
    }
    .sens table.payment th {
        background: #7BCEB8;
        border-bottom: 2px solid #EEEEEE;
        width: 100%;
        display: block;
    }

    .ld table.payment td.display_none{
        display:none;
    }
    .mw120 {
        width: 120px;
    }

    .ld table.cvs, .sens table.cvs {
        width: 290px;
        margin: 0;
    }
    .ld table.cvs.mw100P, .sens table.cvs.mw100P {
        width: 100%;
        margin: 0;
    }

    .sens h2.mw260 {
        width: 260px;
    }
    .sens h2.mw270 {
        width: 270px;
    }

    .listpanel {
        width: 100%;
        height: 550px;
        
    }
    .mtop131 {
        top:131px !important;
    }

    .content-box {
	    margin-bottom:20px;
	    padding:10px;
	    background:#FFFFFF;
	    border:1px solid #DDDDDD;
	    box-shadow: 0px 0px 3px #DDD;
	    -moz-box-shadow: 0px 0px 3px #DDD;
	    -webkit-box-shadow: 0px 0px 3px #DDD;
    }


    /*.mw290 {
        width: 100%;
    }*/

    .mw297 {
        width :288px
    }

    .mw98P {
        width :98%;
    }

    .sens table.margin-l {
        margin-left :0px;
    }

    ul.btnlist li {
	    display:inline;
	    margin:0 4px;
    }
    .ld h3 {
        display:inline-block;
    }
    .sens h3 {
	    height:auto;
	    line-height:30px;
	    padding-left: 30px;
	    font-weight:bold;
	    font-size:117%;
	    background:url(../images/bg_h3.png) no-repeat;
	    color:#8C4600;
        display:inline-block;
    }

    table.payment th {
	    background:#7BCEB8;
	    height:30px;
	    line-height:30px;
	    padding:0px 0px;
	    border-bottom:1px solid #EEE;
	    font-weight:normal;
    }

    table.payment th.head, table.payment th.head2, table.paymentlist th.head {
	    background-color: #7BCEB8;
	    height:35px;
	    line-height:35px;
	    text-align:center;
	    font-weight:normal;
	    font-size:120%;
	    padding: 0px 0px;
    }

    .ld table th, .ld table td, .sens table th, .sens table td {
	    padding: 4px 0px;
        min-height:15px;
    }

    .ld table td.mleft, .modal table td.mleft {
	    text-align: left;
    }

    .ld table td.mw95P {
	    width: 95%;
    }

    td#ContentPlaceHolder1_tdGraduation span.err-msg:after {
        content: '\a';
        white-space: pre;
    }

    div.entry_scrolly_content {
        width: 100%;
        margin: 0;
    }
    div.entry_scrolly_body500 {
        width: 100%;
        overflow-x: hidden;
    }
    div.entry_scrolly_body500 table tbody tr {
        display: block;
        overflow-x: hidden;
        width: calc(100vw - 85px);
        margin-bottom: 2em;
    }
    div.entry_scrolly_body500 table tbody tr td {
        width: calc(100vw - 85px);
        min-width: initial;

    }
  
    /* hover透過 */
    /*a.alpha:hover img, #contents a:hover img,#sidebar a:hover img{*/
    dummy {
        /*モダンブラウザ用*/
        opacity:100;
        /*IE7以下用*/
        filter:alpha(opacity=100);
        /*IE8用*/
        -ms-filter:"alpha(opacity=100)";
    }
    #tabs #nav-fragment-1,
    #tabs #nav-fragment-1 a.title,
    #tabs #nav-fragment-1 img {
        background-image: none;
        width: 100%;
        height: 43px;
    }
    #tabs #nav-fragment-2,
    #tabs #nav-fragment-2 a.title,
    #tabs #nav-fragment-2 img {
        background-image: none;
        width: 100%;
        height: 41px;
    }

    #tabs #nav-fragment-1 a.title,
    #tabs #nav-fragment-1 img {
        display: inline-block;
    }
    #tabs #nav-fragment-2 a.title,
    #tabs #nav-fragment-2 img {
        display: inline-block;
    }
    div.event-name {
        line-height: 30px;
        text-align:center;
    }
    #jump_login_link {
        text-align: left;
    }
    .mtext-a-l {
        text-align:left;
    }
    table.paymentguide_attention td {
        text-align:left;
    }

    span.err-msg {
        text-align:left;
    }

    .title-align {
        text-align:left;
    }

    .mobile-bottom-margin {
        margin-bottom:30px;
    }
    img.btn_entry_login {
        width:100%;
    }
    img.btn_entry {
        width:85%;
    }
    div#headerPanel {
        background-color:white;
    }
    div.entry_scrolly_body.mw95P {
        width:95%;
    }
    .sens table td.mpadtopbtm20 {
        padding:20px 0px;
    }

    .margin-l-10 {
        margin-left:4px;
    }
    .margin-l-20 {
        margin-left:4px;
    }
    .margin-l-30 {
        margin-left:4px;
    }
    .margin-l-40 {
        margin-left:4px;
    }
    .margin-l-50 {
        margin-left:4px;
    }
    .margin-l-60 {
        margin-left:4px;
    }
    .margin-l-70 {
        margin-left:4px;
    }
    .margin-l-80 {
        margin-left:4px;
    }
    .margin-l-90 {
        margin-left:4px;
    }
    .margin-l-100 {
        margin-left:4px;
    }
}

/* スピナー */
#loader-bg {
	display: none;
	position: fixed;
	width: 100%;
	height: 100%;
	top: 0px;
	left: 0px;
	background: #ffffff;
	z-index: 1;
}
#loader {
	display: none;
	position: fixed;
	top: 50%;
	left: 50%;
	width: 270px;
	height: 270px;
	margin-top: -100px;
	margin-left: -100px;
	text-align: center;
	color: red;
	z-index: 2;
}