@charset "UTF-8";
/*=============================================================
 mixin,変数
=============================================================*/
/* 上下中央揃え-ストレッチ */
/* 上下中央揃え */
/* 折り返しする */
/*=============================================================
 02.サービス一覧
=============================================================*/
/*! 02-1-2.会員制サービス
---------------------------------------- */
#member .mainimg { background-image: url(../img/service/pic_mainimg01.png); }
#member .serviceList { margin-bottom: 38px; padding: 15px 15px 11px 15px; background: #f2f3f7; }
@media print, screen and (min-width: 600px) { #member .serviceList { margin-bottom: 90px; padding: 20px 0 0 20px; } }
#member .serviceList .item { position: relative; float: left; width: 48%; height: 57px; overflow: hidden; margin: 0 0 8px 0; padding: 19px 0 0 60px; border: 1px solid #dcdcdc; background: #fff; font-weight: 700; }
#member .serviceList .item:nth-of-type(2n) { float: right; }
#member .serviceList .item:before { display: inline-block; position: absolute; top: 0; left: 0; width: 50px; height: 57px; background: #fff center top no-repeat; background-size: cover; content: ""; }
#member .serviceList .item:nth-child(0):before { background-image: url(../img/service/member/pic_service00.png); }
#member .serviceList .item:nth-child(1):before { background-image: url(../img/service/member/pic_service01.png); }
#member .serviceList .item:nth-child(2):before { background-image: url(../img/service/member/pic_service02.png); }
#member .serviceList .item:nth-child(3):before { background-image: url(../img/service/member/pic_service03.png); }
#member .serviceList .item:nth-child(4):before { background-image: url(../img/service/member/pic_service04.png); }
#member .serviceList .item:nth-child(5):before { background-image: url(../img/service/member/pic_service05.png); }
#member .serviceList .item:nth-child(6):before { background-image: url(../img/service/member/pic_service06.png); }
@media print, screen and (min-width: 600px) { #member .serviceList .item { width: 320px; height: 100px; margin: 0 20px 20px 0; padding: 32px 0 0 145px; font-size: 2.0rem; }  #member .serviceList .item:nth-of-type(2n) { float: left; }  #member .serviceList .item:before { width: 130px; height: 100px; } }
#member #merit { padding-bottom: 10px; }
@media print, screen and (min-width: 600px) { #member #merit { margin-bottom: 50px; } }
#member #merit .meritList { margin-bottom: -5px; }
@media print, screen and (min-width: 600px) { #member #merit .meritList { clear: both; margin-bottom: 40px; }  #member #merit .meritList:nth-of-type(1) { padding-top: 40px; border-top: 1px solid #e4e5e8; }  #member #merit .meritList .image { float: left; width: 380px; }  #member #merit .meritList .meritListIn { float: left; width: 640px; padding-left: 35px; } }
#member #merit .meritList .mod_tit02 { margin-bottom: 12px; }
@media print, screen and (min-width: 600px) { #member #merit .meritList .mod_tit02 { margin-top: -7px; margin-bottom: 14px; font-size: 2.4rem; } }
#member #merit .meritList .mod_tit02 .label { display: block; width: 5em; line-height: 1.6; margin: 20px .5rem 10px 0; padding: 0 5px; background: #062c87; color: #fff; font-family: "Roboto", "メイリオ", "Meiryo", "ヒラギノ角ゴシック Pro", "Hiragino Kaku Gothic Pro","ＭＳ Ｐゴシック", "MS PGothic", sans-serif; font-weight: 700; text-align: center; vertical-align: middle; }
@media print, screen and (min-width: 600px) { #member #merit .meritList .mod_tit02 .label { display: inline-block; margin: 0 1em 0 0; font-size: 1.8rem; } }
#member #privilege { z-index: -1; padding-top: 30px; background-color: #f2f3f7; counter-reset: number 0; }
@media print, screen and (min-width: 600px) { #member #privilege { padding-top: 100px; } }
#member #privilege .pageTitle { width: 100%; text-align: center; }
#member #privilege .privilegeList { margin: 0 0 10px 0; padding: 28px 20px 5px 20px; border: 1px solid #e4e5e8; background: #fff; }
@media print, screen and (min-width: 600px) { #member #privilege .privilegeList { position: relative; float: left; width: 500px; height: 248px; margin: 0 30px 30px 0; padding: 30px 30px 0 30px; }  #member #privilege .privilegeList:nth-of-type(2n) { margin-right: 0; }  #member #privilege .privilegeList:nth-of-type(3) , #member #privilege .privilegeList:nth-of-type(4) { margin-bottom: 0; } }
#member #privilege .privilegeList .icon { display: inline-block; width: 50px; height: 50px; line-height: 1.1; margin: -17px 6px 0 0; padding: 11px 0 0 0; border-radius: 100%; background: #062c87; color: #fff; font-weight: 500; font-size: 1.1rem; text-align: center; }
@media print, screen and (min-width: 600px) { #member #privilege .privilegeList .icon { position: absolute; top: 30; left: 30; width: 60px; height: 60px; margin-top: 0; padding: 16px 0 0 0; font-size: 1.3rem; } }
#member #privilege .privilegeList .icon:after { display: block; font-size: 1.5rem; content: "0" counter(number); counter-increment: number 1; }
@media print, screen and (min-width: 600px) { #member #privilege .privilegeList .icon:after { font-size: 1.7rem; } }
#member #privilege .privilegeList .tit { display: inline-block; vertical-align: middle; }
@media print, screen and (min-width: 600px) { #member #privilege .privilegeList .tit { margin-bottom: 0; padding: 10px 0 0 75px; font-size: 2.4rem; } }
#member #privilege .privilegeList .txt { margin-top: 4px; margin-bottom: 10px; }
@media print, screen and (min-width: 600px) { #member #privilege .privilegeList .txt { margin-top: 18px; } }
#member #privilege .mod_caption { padding: 0 0 35px 0; }
@media print, screen and (min-width: 600px) { #member #privilege .mod_caption { clear: both; padding: 14px 0 94px 0; } }
#member #plan { padding: 35px 0 0 0; }
#member #plan > .list { margin-bottom: 40px; }
#member #plan > .list .item { margin: 20px 0; }
#member #plan > .list .item .tit { color: #333; font-family: "Roboto", "メイリオ", "Meiryo", "ヒラギノ角ゴシック Pro", "Hiragino Kaku Gothic Pro","ＭＳ Ｐゴシック", "MS PGothic", sans-serif; font-weight: 700; font-size: 2.0rem; }
#member #plan > .list .item .tit span { margin-left: 5px; color: #062c87; font-weight: 700; font-size: 3.5rem; vertical-align: baseline; }
@media print, screen and (min-width: 600px) { #member #plan { padding: 100px 0 50px 0; }  #member #plan .pageTitle { margin-bottom: 20px; }  #member #plan > .list { margin-bottom: 87px; }  #member #plan > .list .item { float: left; width: 330px; margin: 10px 0; }  #member #plan > .list .item:nth-of-type(2) { margin: 10px 25px; }  #member #plan > .list .item .tit { margin-bottom: -13px; font-size: 2.8rem; }  #member #plan > .list .item .tit span { margin-left: 10px; font-size: 5.0rem; }  #member #plan .mod_btn04:before , #member #plan .mod_btn04:after { border-width: 1px; } }
.serviceList2 li { margin:0 0 20px; }
.serviceList2 li a { display: block; }
.serviceList2 li.hasLink .image { padding: 0; }
.serviceList2 li.hasLink .image a { padding: 15px; }
.serviceList2 li .image { padding:15px; background:#f4f6fb;}
.serviceList2 li .image img { display: block; margin:auto;}
.serviceList2 li .image img.image-w220 { max-width: 220px; }
.serviceList2 li dt { font-weight: 700; font-size: 1.5rem; color:#062c87; text-align: center; margin: 0.8em 0; line-height:1.2; }
.serviceList2 li dt a { color: #062c87; }
.serviceList2 li .text { text-align:left; color: #333;}
.serviceList2 li .comment { font-size:10px; text-align:right; margin-top:10px; }
@media print, screen and (min-width: 600px) { .serviceList2 li { float:left; width:509px; min-height:616px; } .serviceList2 li:nth-of-type(2n) {float: right;} .serviceList2 li .image { height:370px; position:relative;} .serviceList2 li .image img { position:absolute; top:0; bottom:0; left:0; right:0;} .serviceList2 li dt {font-size:24px; margin: 45px 0;} .serviceList2 li dt.twoline {margin: 30px 0;} .serviceList2 li .comment { font-size:12px; } .serviceList2 li .comment { margin-bottom: -27px;} .serviceList2 li a { transition: opacity .7s; } .serviceList2 li a:hover { opacity: .5; } .serviceList2 li.hasLink .image a { height: 100%; } .serviceList2 li .text { text-align:center; color: #333;} }
#member #merit .meritList .comment { font-size: 10px; clear:both; }
@media print, screen and (min-width: 600px) { #member #merit .meritList .comment { font-size: 12px; padding-top:12px; } }
.member-service { margin-bottom: 10px; }
.member-service .pdfArea {
    margin-top: 15px;
}
.member-service .pdfList .item {
    background: url(../img/common/ico_pdf01.png) 90% 50% no-repeat;
    background-size: 25px;
}
.member-service .pdfList .pdfItem .img {
    text-align: center;
    margin-bottom: 10px;
}
.member-service .pdfList__link {
    padding: 10px 25px;
}
.member-service .txt {
    color: #626c79;
    margin-top: 15px;
    padding: 0 25px;
    letter-spacing: 0.07em
}
.member-service .txt_link {
    display: inline-block;
}

@media print, screen and (min-width: 600px) { 
    .member-service { margin-bottom: 50px; }
    .member-service .pdfArea {
        display: flex;
        flex-wrap: wrap;
        justify-content: center;
        
    }
    .member-service .pdfList .item {
        font-size: 1.2rem;
        background-position: 95% 15px;
    }    
    .member-service .serviceList2 .pdfList {
        width: 50%;
    }
    .member-service .serviceList2 .pdfList .pdfItem {
        float: none;
        width: auto;
        min-height: auto;
    }
    .member-service .pdfList__link {
        padding: 10px 8px;
        
        text-align: left;
    }
    .member-service .pdfList__link:hover,
    .member-service .txt_link:hover {
        text-decoration: underline;
    }  
    .member-service .txt {
        font-size: 1.2rem;
        line-height: 1.8;
        padding: 0 8px;        
    }
    .member-service .grid-area {
        display: grid;
        height: 252px;
        grid-template-rows: 50% 50%;
        grid-template-columns: 100%;
    }
    .member-service .grid-top {
        grid-row: 1;
        grid-column: 1;
    }
    .member-service .grid-bottom {
        grid-row: 2;
        grid-column: 1;
    }
    .member-service .text-small {
        font-size: 1.3rem;
    }
}

/*# sourceMappingURL=maps/member.css.map */