@charset "utf-8";

@media screen and (min-width:1024px){
    .pc-only { display: block !important;}
    .sp-only { display: none !important;}
    .ssp-only { display: none !important;}
    }
@media screen and (max-width:1023.9px) {
    .pc-only { display: none !important;}
    .sp-only { display: block !important;}
    .ssp-only { display: none !important;}
    }
@media screen and (max-width:428px){ 
        .pc-only { display: none !important;}
        .sp-only { display: block !important;}
        .ssp-only { display: block !important;}
    }
/* スライダー画像切替用 */    
@media screen and (min-width:768.1px){
    .slick-pc { display: block !important;}
    .slick-sp { display: none !important;}
    }
@media screen and (max-width:768px) {
    .slick-pc { display: none !important;}
    .slick-sp { display: block !important;}
    }

/* 個別クラス */

.fz16r { font-size: 1.6rem !important; } /* PC画面で12px相当 固定サンプルh6と同等サイズ*/
.fz20r { font-size: 2.0rem !important; } /* PC画面で15px相当 固定サンプルh5と同等サイズ*/
.fz24r { font-size: 2.4rem !important; } /* PC画面で18px相当 固定サンプルh4と同等サイズ*/
.fz28r { font-size: 2.8rem !important; } /* PC画面で21px相当 固定サンプルh3と同等サイズ*/
.fz32r { font-size: 3.2rem !important; } /* PC画面で24px相当 固定サンプルh2と同等サイズ*/
.fz40r { font-size: 4.0rem !important; } /* PC画面で30px相当 固定サンプルh1と同等サイズ*/

.fc_white { color: white !important; }
.fc_black { color: black !important; }
.fc_red { color: red !important; }
.fc_blue { color: blue !important; }
.fc_yellow { color: yellow !important; }
.fc_green { color: green !important; }
.fc_orange { color: orange !important; }

.mb00 { margin-bottom: 0 !important; }
.mb10 { margin-bottom: 10px !important; }
.mb20 { margin-bottom: 20px !important; }
.mb30 { margin-bottom: 30px !important; }
.mb40 { margin-bottom: 40px !important; }
.mb50 { margin-bottom: 50px !important; }
.mb60 { margin-bottom: 60px !important; }

.mt10 { margin-top: 10px !important; }
.mt20 { margin-top: 20px !important; }
.mt30 { margin-top: 30px !important; }
.mt40 { margin-top: 40px !important; }
.mt50 { margin-top: 50px !important; }
.mt60 { margin-top: 60px !important; }

.pt10 { padding-top: 10px !important; }
.pt20 { padding-top: 20px !important; }
.pt30 { padding-top: 30px !important; }
.pt40 { padding-top: 40px !important; }
.pt50 { padding-top: 50px !important; }
.pt60 { padding-top: 60px !important; }


/*-------------------------------------
	page
-------------------------------------*/

/* top */
#loading { position: fixed; top: 0; left: 0; width: 100vw; height: 100dvh; height: 100vh; background: #FFF; opacity: 1; overflow: hidden; z-index: 9999; }
#loading #loadAnime { position:absolute; top:calc(50% - 5.5rem); left: calc(50% - 5.5rem); width: 11rem; height: 11rem; text-align: right; }

#topNotice { padding: 2rem; background: #E6EAEF;}
#topNotice p { line-height: 1.6; text-align: center;}
/*20230201 リンク文字色・太さ変更*/
#topNotice a { display: inline-block; color: #99363b !important; text-decoration: none;}
#topNotice a:hover { text-decoration: underline;}

#registAlart {
    position: fixed;
    top: 10rem;
    left: 50%;
    padding: 3rem 2rem;
    min-width: 36rem;
    background: #FFF;
    box-shadow: 0 0 0.5rem rgba(1, 49, 97, 0.1);
    z-index: 100;
    transform: translateX(-50%);
    transition: all ease 0.3s;
}
#registAlart figure { margin: 0 auto 3rem; max-width: 20rem;}
#registAlart p { margin: 2rem 0 0; font-size: 1.6rem;}
#registAlart a:not(.btn) { text-decoration: none; cursor: pointer;}
#registAlart .btn { margin: 0 0 0 4rem; min-width: 0;}
#registAlart .closeX { position: absolute; top: 1rem; right: 1rem; margin: 0;}
#registAlart .closeX a { opacity: .6;}
#registAlart .closeX a:hover { opacity: 1;}
#registAlart.close { margin-top: 4rem; opacity: 0; pointer-events: none;}
/*TOPスライダー*/
#MainVisual { position: relative; overflow-x: hidden; overflow-y: visible; z-index: 1; }
@media screen and (max-width:768px) {
    #MainVisual { height: 100% !important; }
}
/*@media screen and (max-width:480px) {
    #MainVisual { margin-top: 80px !important; }
}*/
@media screen and (min-width:768.1px){
#MainVisual li { height: calc(80vh - 12.5rem); text-align: center;}
}
@media screen and (max-width:768px) {
#MainVisual li { height:100vw;  text-align: center; }
}

@media screen and (min-width:768.1px){
    #MainVisual li .backImg { position: absolute; top: 0; left: 0; width: 100%; height: 100%;}
    #MainVisual li .backImg img { width: 100%; height: 100%; object-fit:cover;}/*PCでは今までの表示*/
}
@media screen and (max-width:768px) {
    #MainVisual li .backImg { position: absolute; top: 10; left: 0; height: 100vw;}
    #MainVisual li .backImg img { object-fit:contain;}/*タブレット以下(max-width768)のサイズは画面幅100％表示で比率保持*/
}
#MainVisual li .contents { position: absolute; top: 50%; left: 10%; width: 80%; transform: translateY(-50%);}
#MainVisual li .contents h2 { text-shadow: 0 0 0.5rem #FFF, 0 0 1rem #FFF;}
#MainVisual li .contents p { margin: 2rem 0 0; text-shadow: 0 0 0.5rem #FFF, 0 0 1rem #FFF;}
#MainVisual li .contents .btn.light { text-shadow: none; background: rgba(255, 255, 255, 0.3);}

#MainVisual li .contents.white h2,
#MainVisual li .contents.white p { color: #FFF; text-shadow: 0 0 1rem rgba(1, 49, 97, 0.9);}
#MainVisual li .contents.right { left: auto; right: 10%;}
#MainVisual li .contents.right h2,
#MainVisual li .contents.right p { text-align: right !important;}
#MainVisual li .contents.center h2,
#MainVisual li .contents.center p { text-align: center !important;}

#MainVisual li.slide02 .contents { top: 35%;}
#MainVisual li.slide03 .contents { top: 55%;}

#MainVisual li img { height: 100%;}
#MainVisual a:hover .enlargeImg img { -webkit-transform: scale(1.05); transform: scale(1.05);}

#MainVisual .slick-arrow {
    position: absolute;
    top: 0;
    left: 0;
    width: 5rem;
    height: 100%;
    font-size: 0;
    background: rgba(255, 255, 255, 0.3) url("/images/common/arrowLW.svg") center no-repeat;
    background-size: 2.6rem;
    border: none;
    opacity: 0;
    z-index: 10;
    cursor: pointer;
    outline: none;
    transition: all 0.3s ease;
}
#MainVisual .slick-arrow:hover { opacity: 1;}
#MainVisual .slick-next { right: 0; left: auto; background-image: url("/images/common/arrowRW.svg");}

#MainVisual .slick-dots { position: absolute; left: 1rem; bottom: 3rem; z-index: 10;}
#MainVisual .slick-dots li { display: inline-block; margin: 0 1px; width: auto; height: auto; min-height: 0; font-size: 0; }
#MainVisual .slick-dots button { display: block; width: 18px; height: 18px; font-size: 0; background: none; border: none; cursor: pointer; opacity: .6; outline: none; transition: all 0.3s ease; }
#MainVisual .slick-dots button:before,
#MainVisual .slick-dots button:after { content: ""; display: block; position: absolute; top: 4px; left: 4px; width: 10px; height: 10px; background: #FFF; border-radius: 8px; opacity: .7; transition: all 0.3s ease; }
#MainVisual .slick-dots button:after { background: none; border: 0.5px solid #FFF;}
#MainVisual .slick-dots button:hover { opacity: 1; }
#MainVisual .slick-dots button:hover:before, 
#MainVisual .slick-dots button:hover:after,
#MainVisual .slick-dots .slick-active button,
#MainVisual .slick-dots .slick-active button:before { opacity: 1 !important; }
#MainVisual .slick-dots .slick-active button:after { opacity: 1 !important; transform: scale(2);}
@media screen and (min-width:768.1px){
.scrollLink { position: absolute; left: 50%; bottom: 2rem; z-index: 10; -webkit-transform: translateX(-50%); transform: translateX(-50%);}
.scrollLink a { display: block; padding: 0 0 4rem; color: #000 !important; text-decoration: none; text-shadow: 0 0 0.5rem #FFF, 0 0 1rem #FFF; background: url("/images/common/arrowDBts.svg") center bottom 0.5rem no-repeat; background-size: 4rem;}
.scrollLink a:hover { background-position: center bottom;}
}
@media screen and (max-width:768px) {
.scrollLink { position: absolute; left: 50%; bottom: 5rem; z-index: 10; -webkit-transform: translateX(-50%); transform: translateX(-50%);}
.scrollLink a { display: block; padding: 0 0 4rem; color: #000 !important; text-decoration: none; text-shadow: 0 0 0.5rem #FFF, 0 0 1rem #FFF; background: url("/images/common/arrowDBts.svg") center bottom 0.5rem no-repeat; background-size: 4rem;}
.scrollLink a:hover { background-position: center bottom;}
}
@media screen and (max-width:468px) {
.scrollLink { position: absolute; left: 50%; bottom: 0; z-index: 10; -webkit-transform: translateX(-50%); transform: translateX(-50%);}
}

.flexList.topNav figcaption h3 { margin: 0 0 0.5rem; font-size: 1.6rem; text-align: left;}
/* 20220802修正依頼 .flexList.topNav figcaption p { font-size: 1.4rem;}*/
.flexList.topNav figcaption p { font-size: 1.6rem;}

#topSection .flexList figcaption { display: block; -webkit-line-clamp: none; text-overflow: unset;}

#infoList { padding: 1rem 0 0; border-top: 1px solid #000; border-bottom: 1px solid #000;}
#infoList li { margin: 0 0 1rem;}
#infoList a { font-size: 1.6rem; line-height: 1.2; text-decoration: none;}
#infoList a:hover { text-decoration: underline;}
#infoList span { width: calc(100% - 10rem);}
/* 20220802修正依頼 #infoList .date { width: 10rem;}*/
#infoList .date { width: 10rem; margin-right: 1em;}

#connectTop { background: #739DB6;}

#connectTop .connectTopImg { margin: 0 0 4rem;}
#connectTop .connectTopImg img { max-width: min(60rem, 100%);}

#connectList li { background: #FFF; border: none;}
#connectList li::after {
    content: "";
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    border: 1px solid rgba(1, 49, 97, 0.2);
    pointer-events: none;
}
#connectList figcaption { font-weight: bold;}
#connectList .ctProf { display: flex; align-items: center; margin: 0.5rem 1rem 0;}
#connectList .ctProf .cdProf { margin: 0 1rem 0 0; width: min(8rem, 8vw); min-width: min(8rem, 8vw); height: min(8rem, 8vw);}
#connectList .ctProf p { font-size: 1.4rem; line-height: 1.2;}

@media (hover: hover) {
#connectList .ctProf:hover { opacity: .6;}
}
 
#recommendList { overflow: hidden;}
.recommendSlide { position: relative; margin: 0 -2rem 0 0;}
.recommendSlide > ul { opacity: 0; transition: opacity .5s;}
.recommendSlide > ul.slick-initialized { opacity: 1;}
.recommendSlide .slick-list { padding: 0 20% 0 0;}
.recommendSlide .slick-slider { padding: 0 0 7.4rem; width: 120%;}
.recommendSlide .slick-slide { margin: 0 2rem 0 0;}
.recommendSlide .slick-slide a { text-decoration: none;}
.recommendSlide .slick-slide a:hover { text-decoration: underline;}
.recommendSlide .slick-slide figcaption { margin: 0.5rem 0 0; font-size: 1.2rem; line-height: 1.4; text-align: left;}
.recommendSlide .slick-arrow {
    position: absolute;
    bottom: 0;
    left: 0;
    width: 4.4rem;
    height: 4.4rem;
    font-size: 0;
    background: #FFF url("/images/common/arrowLt.svg") center no-repeat;
    background-size: 2.6rem;
    border: none;
    border-radius: 4rem;
    box-shadow: 0 0.2rem 1rem rgba(1, 49, 97, 0.2);
    cursor: pointer;
    outline: none;
    transition: all 0.3s ease;
}
.recommendSlide .slick-arrow:hover { box-shadow: 0 0.5rem 1.5rem rgba(1, 49, 97, 0.3);}
.recommendSlide .slick-arrow:after { content: ""; position: absolute; top: -0.2rem; left: -0.2rem; width: calc(100% + 0.4rem); height: calc(100% + 0.4rem); border: 1px solid #013161; border-radius: 4rem; transition: all 0.3s ease;}
.recommendSlide .slick-arrow:hover:after { top: 0.2rem; left: 0.2rem; width: calc(100% - 0.4rem); height: calc(100% - 0.4rem);}
.recommendSlide .slick-next { left: 5.9rem; background-image: url("/images/common/arrowRt.svg");}
.recommendSlide .slick-disabled { opacity: .5; pointer-events: none;}

.recommendSlide .slick-dots { position: absolute; bottom: 2.2rem; left: 13rem; width: calc(100vw - 17rem);}
.recommendSlide .slick-dots li { flex-grow: 1; pointer-events: none;}
.recommendSlide .slick-dots button { display: block; position: relative; padding: 0; width: 100%; height: 2px; font-size: 0; background: rgba(1, 49, 97, 0.2); border: none; cursor: pointer; outline: none;}
.recommendSlide .slick-dots button:after { content: ""; display: block; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: #013161; transition: all 0.3s ease;}
.recommendSlide .slick-dots .slick-active ~ li button:after { width: 0;}

.recommendSlide .slick-slider:has(.slick-dots li:first-child:last-child),
.recommendSlide .slick-slider:has(.slick-dots li:first-child:last-child) .slick-slide { padding-bottom: 0;}
.recommendSlide .slick-dots:has(li:first-child:last-child) { display: none;}

.recommendSlide + .center { margin: 2rem 0 0;}
.recommendSlide + .center .btn { width: 100%;}

#keywordList { margin: 0 -1.2rem -1.2rem 0;}
#keywordList li { display: inline-block; margin: 0 1.2rem 1.2rem 0;}
#keywordList a { display: block; padding: 0.6rem 1.5rem; color: #000 !important; font-size: 1.6rem; line-height: 1; text-decoration: none; background: #FFF; border: 1px solid #000; border-radius: 2rem;}
#keywordList a:hover { opacity: .6;}

#categoryList { margin: 0 -0.5rem -1rem;}
#categoryList .categoryL li { margin: 0 0.5rem 1rem; width: calc(50% - 1rem);}
#categoryList .categoryL h3 { margin: 0; font-size: 1.4rem;}
#categoryList .categoryL h3 a { text-decoration: none;}
#categoryList .categoryL h3 a:hover { text-decoration: underline;}
#categoryList .categoryL figure { margin: 0 1rem 0 0; width: 5rem; height: 5rem; border-radius: 5rem; overflow: hidden;}
#categoryList .categoryL span { width: calc(100% - 6rem);}
#categoryList .categoryM { display: none;}

#brandList { margin: 0 -2rem;}
#brandList li { padding: 1rem 2rem; width: 50%; }
#brandList li:nth-child(2n) { border-left: 1px solid #000;}
#brandList li a { font-size: 1.4rem; text-decoration: none;}
#brandList li a:hover { text-decoration: underline;}

/* category */
.category section:last-of-type { padding-bottom: 4rem;}
.category h2 { text-align: left;}

.catTop .rightBtn { display: none;}
.catTop .center .btn { width: 100%;}

.catMidList.flexList li { margin-bottom: 0;}
.catMidList.flexList figcaption { font-size: 1.1rem;}

.storeImg { margin: 0 -2rem;}
.storeBtns { margin: 0 0 3rem; font-size: 0; text-align: center;}
.storeBtns .btn { margin: 2rem 0 0; width: calc(50% - 1rem); min-width: 0;}
.storeBtns .btn:nth-child(2), .storeBtns .btn:nth-child(4) { margin-left: 2rem;}
.storeBtns .orBtnGroup .btn { margin-bottom: 1rem; width: 100%;}

#virtualStore { margin: 0 -2rem;}

.virtualBtns { text-align: center;}
.virtualBtns .btn { margin: 2rem 0 0; width: 100%;}

.calOff { display: inline-block; margin: 0 1rem 0 0; width: 3rem; height: 3rem; color: #FFF; background: #013161; vertical-align: middle;}
.calendars { margin: 0 -1rem;}
.calendars div { margin: 0 0 2rem; padding: 0 1rem; width: 50%;}
.calendars caption { padding: 1rem; font-weight: bold; text-align: center;}
.calendars th,
.calendars td { display: table-cell; padding: 1rem 0; text-align: center;}
.calendars th { background: #f1f5f9;}
.calendars .off { color: #fe0b2e; background: #fce3d6;}

/* search */
#catFlex { margin: 1rem 0 0;}
#catSide { padding: 0 2rem; width: 100%;}
#catSide .sideSearch { margin: 1rem 0 0;}
#catSide .acd { position: relative; padding: 1rem 3rem 1rem 1rem; cursor: pointer;}
#catSide .acd:after { content: ""; display: block; position: absolute; top: 50%; right: 1rem; margin: -0.8rem 0 0; width: 1.4rem; height: 1.4rem; background: url("/images/common/arrowDBt.svg") no-repeat; background-size: contain; transition: all 0.3s ease;}
#catSide .acd.open:after { transform: scale(1,-1);}
#catSide .acd.sideTitle { color: #FFF; background: rgba(1, 49, 97, 0.5);}
#catSide .acd.sideTitle:after { right: 1rem; background-image: url("/images/common/arrowDWt.svg");}
#catSide .sideDt { font-weight: 900; /*border-bottom: 1px solid #000;*/ margin: 1em 0 1em 1em;}
#catSide .sideDd { margin: 0 -2rem 0 0; padding: 1rem 0 0 1rem;}
#catSide .sideDd.prices { align-items: center; margin: 0 0 1rem;}
#catSide .sideDd.prices input { margin: 0 1rem; width: calc(50% - 3.5rem);}
#catSide .sideDd.prices input:first-child { margin-left: 0;}
#catSide .sideDd.keyword { padding: 0.5rem 1rem 0;}
#catSide .sideDd ul { padding: 1rem 0 0;}
#catSide .sideDd li,
#catSide .sideDd label { display: inline-block; margin: 0 2rem 1rem 0; min-width: calc(49% - 2rem);}
#catSide .center { padding: 2rem 0;}
#catSide .center .btn { width: calc(100% - 2rem); margin: 10px auto !important; }
#catSide .center .btn.gray { margin: 2rem 0 0;}

#catMain { width: 100%;}
#catMain .categoryL a { align-items: center; text-decoration: none;}
#catMain .categoryL a:hover { text-decoration: underline;}

.paging { margin: 2rem 0; padding: 0 0 1rem; border-bottom: 1px solid #000;}

.pager { padding: 0 0 1rem; text-align: center; border-bottom: 1px solid #000;}
.pager li { display: inline-block;margin: 0 0.3rem;vertical-align: middle;}
.pager a { display: block; width: 3rem; line-height: 3rem; text-align: center ;text-decoration: none; border-radius: 5rem;}
.pager a.current { color: #FFF; background: #000;}
.pager a:hover { color: #013161; background: rgba(1, 49, 97, 0.1);}
.pager a.disabled { pointer-events: none;}
.pager.bottom { margin: 0; padding: 1rem 0 0; border-bottom: none; border-top: 1px solid #000;}

.flexList.sarchResult figure { position: relative; padding: 120% 0 0;}
.flexList.sarchResult .enlargeImg { position: absolute; top: 0; left: 0; width: 100%; padding: 120% 0 0;}
.flexList.sarchResult .enlargeImg img { position: absolute; top: 0; left: 0; width: 100%; height: 100%; object-fit: cover;}

.itemList ul { margin: 0 -1rem -2rem;}
.itemList li { margin: 0 1rem 2rem; padding: 0 0 3.6rem; width: calc(50% - 2rem);}
.itemList li a { text-decoration: none;}
.itemList li .enlargeImg { align-items: end; justify-content: center; width: 100%; height: 20rem; text-align: center;}
.itemList li h3 { margin: 1rem 0 0.5rem; font-size: min(3.5vw, 1.6rem);}
.itemList li .icons { position: absolute; top: 0; left: 0; margin: 0; width: 100%; z-index: 1;}
.itemList li .icons .icon { display: block; padding: 0.2rem 0.5rem; width: 100%; color: #FF00A6; font-size: 1.2rem; text-align: center; background: rgba(255, 255, 255, 0.5);}
.itemList li div,
.itemList li p { margin: 0.5rem 0 0; font-size: min(3.5vw, 1.6rem);}
.itemList li p img { position: relative; top: -0.2rem; margin: 0 0.2rem 0 0; width: 2rem; vertical-align: middle;}
.itemList li p.addBtn { position: absolute; bottom: 0; left: 0; width: 100%;}

/* detail */
.detail section { overflow: hidden;}
.detail section:last-of-type { padding-bottom: 4rem;}
.detail h1,
.detail h2.line { text-align: left;}
.detail h2.line + .right { margin: -5.5rem 0 3rem;}
.detail h2.line + .right strong { font-size: 1.8rem;}
.detail h2.line + .right strong strong { font-size: 2rem;}
.detail .itemList h3 { font-weight: normal; line-height: 1.4; text-align: left;}
.detail .itemList .btn { width: 100%; min-width: 0; opacity: 1 !important;}

.detail .recommendSlide .slick-slider { position: static; padding: 0;}
.detail .recommendSlide .slick-arrow { bottom: 50%; left: -1rem; transform: translateY(50%); opacity: 0; z-index: 10;}
.detail .recommendSlide:hover .slick-arrow { opacity: .5;}
.detail .recommendSlide:hover .slick-arrow.slick-disabled { opacity: .3;}
.detail .recommendSlide:hover .slick-arrow:hover { opacity: 1;}
.detail .recommendSlide .slick-next { left: auto; right: 1rem;}
.detail .recommendSlide .slick-slide figcaption { text-align: left;}

#detailTop .slick-arrow {
    position: absolute;
    top: 40%;
    left: 0;
    width: 20%;
    height: 20%;
    font-size: 0;
    background: rgba(255, 255, 255, 0.3) url("/images/common/arrowLW.svg") center no-repeat;
    background-size: 2.6rem;
    border: none;
    opacity: 0;
    z-index: 10;
    cursor: pointer;
    outline: none;
    transition: all 0.3s ease;
}
#detailTop .slick-arrow:hover { opacity: 1;}
#detailTop .slick-arrow.slick-disabled{ opacity: 0; pointer-events: none;}
#detailTop .slick-next { right: 0; left: auto; background-image: url("/images/common/arrowRW.svg");}
#detailSlide { overflow: hidden;}

#mainSlide { margin: 0 0 1rem;}
#mainSlide li img { max-height: 80vw;}
#navSlide { margin: 0 0 2rem; width: 120%;}
#navSlide li img { max-height: 10rem;}
#navSlide .slick-slide { margin: 0 1rem 0 0; min-width: 10rem; text-align: center; cursor: pointer;}
#navSlide .slick-slide img {transition: all 0.3s ease;}
#navSlide .slick-arrow { top: 0; width: 10%; height: 100%; opacity: .6;}
#navSlide .slick-next { right: 17%;}
#navSlide .slick-active ~ .slick-active img { opacity: 1;}
#navSlide .slick-slide:hover img { opacity: .8;}
#navSlide .slick-active img { opacity: .6;}

#tagList { margin: 0 -1.2rem -1.2rem 0; text-align: left;}
#tagList li { display: inline-block; margin: 0 1.2rem 1.2rem 0;}
#tagList a { display: block; padding: 0.6rem 1.5rem; color: #000 !important; font-size: 1.6rem; line-height: 1; text-decoration: none; background: #FFF; border: 1px solid #000;}
#tagList a:hover { opacity: .6;}

/* company */
main.company section { padding: 0;}
main.category.company section:last-of-type { padding-bottom: 2rem;}
main.company .section { padding: 2rem;}
main.company h2,
main.company h3 { text-align: left;}
main.company h4 { margin: 0 0 1.5rem; font-size: 1.8rem; text-align: left;}
main.company h5 { margin: 0 0 1rem; font-size: 1.6rem; text-align: left;}
main.company p { margin: 0 0 2rem; line-height: 1.6;}
main.company p.lead { font-weight: bold;}
main.company .bg { display: inline; padding: 0 0.5rem; background: #FFF; -webkit-box-decoration-break: clone; box-decoration-break: clone;}

/* 220802 修正対応↓一行
main .companyCns { background: url("/images/company/bg-tri01.png") right bottom no-repeat; background-size: auto 50%;}*/
main .companyCns .section { padding-bottom: 15rem;}
main .companyCns h2 { font-size: 2.4rem;}

main .companyOas { background: url("/images/company/bg-tri02.png") left top no-repeat; background-size: 100% auto;}
main .companyOas .section { padding-top: 18rem;}
main .companyOas h2 { margin: 0 0 1rem; color: #005897; text-align: right;}
main .companyOas h3 { text-align: right;}

main .companyHad { background: url("/images/company/bg-tri03.png") right bottom no-repeat; background-size: 100% auto;}
main .companyHad .section { padding-bottom: 18rem;}
main .companyHad h2 { margin: 0 0 1rem; color: #994c29;}

main .companyOss01 { background: url("/images/company/bg-tri04.png") left top no-repeat; background-size: 60% auto;}
main .companyOss01 .section { padding-top: 15rem;}
main .companyOss01 h2 { font-size: 2.4rem; text-align: right;}
main .companyOss01 h3 { margin: 4rem 0 1rem; color: #476f8d;}
main .companyOss01 img { margin: 0.5rem; height: 6rem;}

main .companyOss02 { background: url("/images/company/bg-tri05.png") left bottom no-repeat; background-size: 100% auto;}
main .companyOss02 .section { padding-bottom: 15rem;}
main .companyOss02 h3 { margin: 0 0 1rem; color: #637f66;}
main .companyOss02 img { margin: 0.5rem 0; height: 6rem;}

main .companyOss03 { background: url("/images/company/bg-tri06.png") right bottom no-repeat; background-size: 60% auto;}
main .companyOss03 .section { padding-bottom: 18rem;}
main .companyOss03 h3 { margin: 0 0 1rem; color: #a9715b;}

main .companyOss04 { background: url("/images/company/bg-tri07.png") right top no-repeat; background-size: 100% auto;}
main .companyOss04 .section { padding-top: 15rem;}
main .companyOss04 h3 { margin: 0 0 1rem; color: #c7a766;}

main .companyAwr01 { background: url("/images/company/bg-tri08.png") left top no-repeat; background-size: 100% auto;}
main .companyAwr01 .section { padding-top: 12rem;}
main .companyAwr01 h2 { margin: 0 0 2rem auto; max-width: 50%; text-align: right;}
main .companyAwr01 h3 { margin: 0 0 1rem; color: #477e5c;}
main .companyAwr01 .shops > div { margin: 2rem 0 0;}
main .companyAwr01 .shops > .logoImg { margin: 0 0 -1rem;}
main .companyAwr01 .logoImg img { max-width: 8rem;}
main .companyAwr01 .storeImg { margin: 2rem 0 1rem;}
main .companyAwr01 .storeImg img { max-width: 20rem;}
main .companyAwr01 .partnerShops { display: flex; flex-wrap: wrap;}
main .companyAwr01 .partnerShops dt { margin: 0 0 1rem; width: 11rem;}
main .companyAwr01 .partnerShops dd { margin: 0 0 1rem; width: calc(100% - 11rem); line-height: 1.4;}
main .companyAwr01 .partnerShops dt:last-of-type,
main .companyAwr01 .partnerShops dd:last-of-type { margin: 0;}

main .companyAwr02 { background: url("/images/company/bg-tri09.png") right top no-repeat; background-size: 50% auto;}
main .companyAwr02 .section { padding-top: 12rem;}
main .companyAwr02 h2 { margin: 0 0 1rem; color: #d0a44e;}

main .companyAwr03 { background: url("/images/company/bg-tri10.png") right bottom no-repeat; background-size: 70% auto;}
main .companyAwr03 .section { padding-bottom: 15rem;}
main .companyAwr03 h2 { margin: 0 0 1rem; color: #a3a2c8;}

main .companyEdu { background: url("/images/company/bg-tri11.png") right top no-repeat; background-size: 80% auto;}
main .companyEdu .section { padding-top: 15rem;}
main .companyEdu h2 { color: #a9715b;}
main .companyEdu h3 { margin: 0 0 1rem;}
main .companyEdu h3 img { max-width: 20rem;}
main .companyEdu h4 { color: #e00000;}
main .companyEdu h4 small { color: #262C33;}

main .companyFal { background: url("/images/company/bg-tri12.png") left bottom no-repeat; background-size: 100% auto;}
main .companyFal .section { padding-bottom: 24rem;}
main .companyFal h2 { margin: 0 0 1rem; color: #637f66;}

main .companyAbt .section div { margin: 2rem 0 0;}
main .companyAbt h3 { margin: 0 0 1rem; color: #013161; font-size: 1.8rem;}
main .companyAbt h4 { font-size: 1.6rem;}
main .companyAbt dl { display: flex; flex-wrap: wrap;}
main .companyAbt dt {margin: 0 0 1rem; width: 10rem; font-size: 1.4rem; font-weight: bold; line-height: 1.5;}
main .companyAbt dd { margin: 0 0 1rem; width: calc(100% - 10rem); line-height: 1.4;}
main .companyAbt dd ol { margin: 0 0 0 2rem;}
main .companyAbt dl ol li { margin: 0 0 0.5rem; line-height: 1.2; list-style: decimal outside;}
main .companyAbt dl ol li:last-child { margin: 0;}
main .companyAbt .shortDt dt { width: 8rem;}
main .companyAbt .shortDt dd { width: calc(100% - 8rem);}
main .companyAbt .longDt dt { width: 13rem;}
main .companyAbt .longDt dd { width: calc(100% - 13rem);}

/* recruitNew */
main:has(#recruitNewTop)::before {
    content: "";
    position: absolute;
    top: 12.5rem;
    left: 0;
    width: 100%;
    height: clamp(60rem, 95vw, 100rem);
    background: url(/images/company/image-recruit-sp.png) center bottom no-repeat;
    background-size: max(475px, 100%) auto;
    z-index: -1;
}
main:has(#recruitNewTop) #breadCrumbs,
main:has(#recruitNewTop) > .wpPage > h1 { display: none;}
#recruitNewTop { padding-top: clamp(50rem, 90vw, 75rem);}
#recruitNewTop h1 { font-size: max(2rem, 2vw); line-height: 1.3; text-align: center;}
#recruitNewTop h1 strong { font-size: max(3rem, 3vw);}
#recruitNewTop p { margin: 3rem 0 0; line-height: 1.5; text-align: center;}

.wpPage.recruitNewLinks h2 { max-width: none !important; line-height: 1; text-align: left;}
.wpPage.recruitNewLinks h2 span { position: relative; padding: 0 1rem 0 0; background: #FFF;}
.wpPage.recruitNewLinks h2::before {
    content: "";
    position: absolute;
    bottom: 0.2rem;
    left: 0;
    width: 100%;
    height: 1px;
    background: #000;
    z-index: -1;
}
.recruitLinks.flexList,
.recruitAbouts.flexList { margin-bottom: -2rem;}
.recruitLinks.flexList li { margin: 0 auto 2rem; width: 60%;}
.recruitLinks.flexList a {
    display: block;
    margin: 0 auto;
    padding: 2rem;
    max-width: 50rem;
    color: #FFF !important;
    font-size: 1.8rem;
    font-weight: bold;
    text-align: left;
    background: #0078ce url(/images/common/arrowRW.svg) right 2rem center no-repeat;
    background-size: 2rem;
}
.recruitLinks.flexList a:hover { background-position: right 1rem center;}

.recruitAbouts.flexList figcaption {
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    margin: 0;
    padding: max(2rem, 4vw);
    width: 100%;
    height: 100%;
    color: #FFF !important;
    text-decoration: none !important;
    text-overflow: unset;
    background: rgba(0, 0, 0, 0.4);
}
.recruitAbouts.flexList figcaption h3 { margin: 0 !important; color: #FFF !important; font-size: max(1.8rem, 2.5vw); font-weight: normal; text-align: left;}
.recruitAbouts.flexList figcaption h3 strong { font-size: max(2.5rem, 4vw); font-weight: bold;}
.recruitAbouts.flexList figcaption p { position: absolute; bottom: max(1.5rem, 3vw); right: max(2rem, 4vw); font-size: max(1.6rem, 2vw); font-weight: bold;}
.recruitAbouts.flexList figcaption img { position: relative; top: max(-0.2rem, -0.2vw); margin: 0 0 0 max(0.5rem, 0.5vw); width: max(1.8rem, 1.8vw); vertical-align: middle;}

/* membership */
main .membership h2 { text-align: center;}
main .membership h4 small { display: inline-block;}
main .membership h4.left + p { margin: 0 0 2rem;}
main .membership p { margin: 0 0 2rem; line-height: 1.6;}
main .membership li { font-size: 1.6rem;}
main .membership li:last-child { margin-bottom: 0 !important;}

.borderBox { margin: 3rem 0 0; padding: 2rem; border: 1px solid #333;}
.borderBox h3 { margin: -3rem auto 2rem;}
.borderBox h3 span { padding: 0 1rem; background: #FFF;}
.borderBox ol li { margin: 0 0 1rem;}
.borderBox ol strong {
    margin: 0 2rem 0 0;
    padding: 1rem 0 0;
    width: 6rem;
    height: 6rem;
    color: #FFF;
    font-size: 2rem;
    text-align: center;
    background: #013161;
    border-radius: 6rem;
}
.borderBox ol strong span { display: block; font-size: 1.1rem;}
.borderBox ol p { width: calc(100% - 8rem);}

.flexBlock div { margin: 2rem 0 0;}
.flexBlock h3 { padding: 0 0 0.5rem; text-align: left; border-bottom: 1px solid #333;}
.flexBlock ol li { margin: 0 0 1rem 2rem; list-style: decimal outside;}
.flexBlock .flexBlock p { margin: 0; width: calc(100% - 12rem);}
.flexBlock .flexBlock p.right { margin: 0 0 0 2rem; width: 10rem;}

.blockBg { padding: 0.8rem 1rem; color: #FFF; background: #333;}

.lineBg::before { content: ""; display: block; position: absolute; top: 50%; left: 0; width: 100%; height: 1px; background: #333;}
.lineBg span { position: relative; padding: 0 1rem; background: #FFF; z-index: 1;}

.discList { margin: 0 0 2rem;}
.discList li { display: inline-block; margin: 0 0.5rem 1rem; padding: 0 0 0 1rem;}
.discList li:before { content: ""; display: block; position: absolute; top: calc(50% - 0.3rem); left: 0; width: 0.6rem; height: 0.6rem;; background: #333; border-radius: 4rem;}

.aboutList { margin: 0 0 2rem;}
.aboutList li { margin: 0 0 1rem;}

.pagination { padding: 1rem 0 0; border-top: 1px solid #000;}
.pagination .page_num { margin: 0 auto 0 0;;}
.pagination .pager,
.pagination .prev,
.pagination .next { margin: 0 0 0 0.6rem;padding: 0;width: 3rem; line-height: 3rem; text-align: center; text-decoration: none; border: none; border-radius: 5rem;}
.pagination .pager:hover,
.pagination .prev:hover,
.pagination .next:hover { color: #013161; background: rgba(1, 49, 97, 0.1);}
.pagination .pager.current { color: #FFF; background: #000;}
.pagination .prev,
.pagination .next { margin: 0 0 0 0.6rem; padding: 0 1rem; width: auto !important; text-decoration: none;}

/* 404 */
main section.notFound { min-height: calc(100vh - 42.6rem); min-height: calc(100dvh - 42.6rem);}
.notFound figure { margin: 0 auto 2rem; width: min(80%, 60rem);}
.notFound h1 strong { font-size: 5rem;}
.notFound p { margin: 4rem 0 0; line-height: 1.6;}

/* wpPage */
.wpPage { 
    padding: 2rem 0; 
    margin: 0 auto;
}
.wpPage > div { padding: 2rem; overflow: hidden;}
.wpPage > p { padding: 2rem; line-height: 1.6;}
.wpPage h1,
.wpPage h2,
.wpPage h3,
.wpPage h4,
.wpPage h5,
.wpPage h6 { text-align: left;}
.wpPage h1 { font-size: 2.6rem;}
.wpPage h2 { font-size: 2.4rem;}
.wpPage h3 { font-size: 2.2rem;}
.wpPage h4 { font-size: 2rem;}
.wpPage h5 { font-size: 1.8rem;}
.wpPage h6 { font-size: 1.6rem;}
.wpPage > h1,
.wpPage > h2,
.wpPage > h3,
.wpPage > h4,
.wpPage > h5,
.wpPage > h6 { padding: 0 2rem;}
.wpPage > h1 + div,
.wpPage > h1 + p,
.wpPage > h2 + div,
.wpPage > h2 + p,
.wpPage > h3 + div,
.wpPage > h3 + p,
.wpPage > h4 + div,
.wpPage > h4 + p,
.wpPage > h5 + div,
.wpPage > h5 + p,
.wpPage > h6 + div,
.wpPage > h6 + p { margin: -2rem 0 0;}
/*.wpPage > div div,*/
.wpPage > div p { margin: 0 0 2rem; line-height: 1.6;}
.wpPage > div div:last-child { margin-bottom: 0 !important; }



.wpPage .colorG { background: #edfffa;}
.wpPage .colorY { background: #FFFDC9;}

/*20221227～追加　.wpPage 背景色*/
.wpPage .colorCC { background: #2A599D;}
.wpPage .colorGRY { background: #f7f6fb;}
.wpPage .colorGRN { background: #00984f;}
.wpPage .colorWHT { background: #ffffff;}
/*20221227～追加　.wpPage 背景色　ここまで*/

/*20221227～追加　.wpPage 文字色*/
.wpPage .textW { color:#fff; }
.wpPage .textCC { color:#2A599D;}
.wpPage .textGRN { color: #00984f;}
.wpPage .textRED { color: #ff0000;}
.wpPage .textPPU { color: #da81b2;}
/*20221227～追加　.wpPage 文字色　ここまで*/

.wpPage .mainVisualA,
.wpPage .mainVisualD { padding: 2rem 0;}
.wpPage .mainVisualA > div,
.wpPage .mainVisualD > div { text-align: center;}
.wpPage .mainVisualB { padding: 2rem 1.5rem;}
.wpPage .mainVisualB > div div { margin: 0 0.5rem;}
.wpPage .mainVisualC ul { margin: 0 auto; width: 70%;}
.wpPage .mainVisualC li { margin: 0 0.5rem;}
.wpPage .mainVisualC .slick-arrow {
    position: absolute;
    top: 50%;
    left: -25%;
    margin: -2rem 0 0;
    width: 3rem;
    height: 3rem;
    font-size: 0;
    background: #FFF url("/images/common/arrowLt.svg") center no-repeat;
    background-size: 2rem;
    border: none;
    border-radius: 4rem;
    box-shadow: 0 0.2rem 1rem rgba(1, 49, 97, 0.2);
    cursor: pointer;
    outline: none;
    opacity: .6;
    z-index: 10;
    transition: all 0.3s ease;
}
/*mainVisual追加依頼分*/
.wpPage .mainVisualE { width: 100%; margin: 0 auto; text-align: center; }
.wpPage .mainVisualE .mainVisualE__inner { width: 100%; max-width: 1200px; margin: 0 auto; }
.wpPage .mainVisualE .mainVisualE__inner img { width: 100%; max-width: 1200px; margin: 0; padding: 0; }
.wpPage .mainVisualF { width: 100%; margin: 0 auto; text-align: center; }
.wpPage .mainVisualF .mainVisualF__inner { width: 100%; max-width: 800px; margin: 0 auto; }
.wpPage .mainVisualF .mainVisualF__inner img { width: 100%; max-width: 800px; margin: 0; padding: 0; }
.wpPage .mainVisualG { width: 100%; margin: 0 auto; text-align: center; }
.wpPage .mainVisualG .mainVisualG__inner { width: 100%; max-width: 500px; margin: 0 auto; }
.wpPage .mainVisualG .mainVisualG__inner img { width: 100%; max-width: 500px; margin: 0; padding: 0; }

@media print, screen and (max-width:1023.9px){
    .wpPage .mainVisualE { width: calc(100% - 4rem); margin: 0 2rem; padding: 0 !important; text-align: center; }
    .wpPage .mainVisualE .mainVisualE__inner { width: 100%; margin: 0 auto; }
    .wpPage .mainVisualE .mainVisualE__inner img { width: 100%; margin: 0; padding: 0; }
    .wpPage .mainVisualF { width: calc(100% - 8rem); margin: 0 4rem; padding: 0 !important; text-align: center; }
    .wpPage .mainVisualF .mainVisualF__inner { width: 100%; margin: 0 auto; }
    .wpPage .mainVisualF .mainVisualF__inner img { width: 100%; margin: 0; padding: 0; }
    .wpPage .mainVisualG { width: calc(100% - 16rem); margin: 0 8rem; padding: 0 !important; text-align: center; }
    .wpPage .mainVisualG .mainVisualG__inner { width: 100%; margin: 0 auto; }
    .wpPage .mainVisualG .mainVisualG__inner img { width: 100%; margin: 0; padding: 0; }    
}
/*mainVisual追加依頼分ここまで*/



.wpPage .mainVisualC .slick-arrow:hover { box-shadow: 0 0.5rem 1.5rem rgba(1, 49, 97, 0.3);}
.wpPage .mainVisualC .slick-arrow:after { content: ""; position: absolute; top: -0.2rem; left: -0.2rem; width: calc(100% + 0.4rem); height: calc(100% + 0.4rem); border: 1px solid #013161; border-radius: 4rem; transition: all 0.3s ease;}
.wpPage .mainVisualC .slick-arrow:hover { opacity: 1;}
.wpPage .mainVisualC .slick-arrow:hover:after { top: 0.2rem; left: 0.2rem; width: calc(100% - 0.4rem); height: calc(100% - 0.4rem);}
.wpPage .mainVisualC .slick-next { left: auto; right: -25%; background-image: url("/images/common/arrowRt.svg");}
.wpPage .mainVisualC .slick-disabled { opacity: .5; pointer-events: none;}
.wpPage .mainVisualC .slick-dots { position: absolute; left: 50%; bottom: -3rem; width: auto; z-index: 10; transform: translateX(-50%);}
.wpPage .mainVisualC .slick-dots li { display: inline-block; margin: 0 1px; width: auto; height: auto; min-height: 0; font-size: 0; }
.wpPage .mainVisualC .slick-dots button { display: block; width: 18px; height: 18px; font-size: 0; background: none; border: none; cursor: pointer; opacity: .6; outline: none; transition: all 0.3s ease; }
.wpPage .mainVisualC .slick-dots button:before,
.wpPage .mainVisualC .slick-dots button:after { content: ""; display: block; position: absolute; top: 4px; left: 4px; width: 10px; height: 10px; background: #013161; border-radius: 8px; opacity: .3; transition: all 0.3s ease; }
.wpPage .mainVisualC .slick-dots button:after { background: none; border: 0.5px solid #013161;}
.wpPage .mainVisualC .slick-dots button:hover { opacity: .5; }
.wpPage .mainVisualC .slick-dots button:hover:before, 
.wpPage .mainVisualC .slick-dots button:hover:after,
.wpPage .mainVisualC .slick-dots .slick-active button,
.wpPage .mainVisualC .slick-dots .slick-active button:before { opacity: .7 !important; }
.wpPage .mainVisualC .slick-dots .slick-active button:after { opacity: .7 !important; transform: scale(2);}





.wpPage .textGroupAL h2,
.wpPage .textGroupAL p { text-align: left;}
.wpPage .textGroupAC h2,
.wpPage .textGroupAC p { text-align: center;}
.wpPage .textGroupAR h2,
.wpPage .textGroupAR p { text-align: right;}
.wpPage .textGroupFR h2 { order: 2; margin: 0 0 0 1rem; min-width: 30%;}
.wpPage .textGroupFL h2 { margin: 0 1rem 0 0; min-width: 30%;}

.wpPage hr { margin: 4rem 2rem; width: calc(100% - 4rem); border-bottom: 1px solid #333;}
.wpPage div hr { margin: 4rem auto; width: 100%;}
.wpPage hr.dotted { border-bottom: 1px dotted #333;}
.wpPage hr.dashed { border-bottom: 1px dashed #333;}
.wpPage hr.fat { border-bottom: 3px solid #333;}
.wpPage hr.double { border-bottom: 4px double #333;}

.wpPage .imgTextGroupFR div,
.wpPage .imgTextGroupFL div { width: 100%;}
.wpPage .imgTextGroupFR h3,
.wpPage .imgTextGroupFL h3 { text-align: center;}
.wpPage .imgTextGroupL { padding: 2rem 1rem;}
.wpPage .imgTextGroupL > div > div { margin: 0 1rem;}
.wpPage .imgTextGroupM > div > div { width: 100%;}
.wpPage .imgTextGroupM .figure { margin: 0 2rem 0 0; max-width: 30%;}
.wpPage .imgTextGroupS,
.wpPage .imgTextGroupF { padding: 2rem 1rem;}
.wpPage .imgTextGroupS > div > div { margin: 0 1rem 2rem; width: calc(50% - 2rem);}
.wpPage .imgTextGroupS > div > div:nth-last-child(2),
.wpPage .imgTextGroupF > div > div:nth-last-child(2) { margin-bottom: 0;}
.wpPage .imgTextGroupF > div > div { margin: 0 1rem 2rem; width: calc(45% - 2rem);}

.wpPage .recommendSlide.wpSlide { margin: 0;}
.wpPage .recommendSlide.wpSlide .slick-slider { width: calc(100% + 2rem);}
.wpPage .recommendSlide.wpSlide .slick-list { padding: 0; overflow: hidden;}

.wpPage .imgTile4 { padding: 2rem 1.5rem 1rem;}
.wpPage .imgTile4 > div div { margin: 0 0.5rem 1rem; width: calc(50% - 1rem);}
.wpPage .imgTile9,
.wpPage .imgTile16 { padding: 2rem 1.7rem 1.4rem;}
.wpPage .imgTile9 > div div,
.wpPage .imgTile16 > div div { margin: 0 0.3rem 0.6rem; width: calc(33.33% - 0.6rem);}
.wpPage .imgTile16 { margin: 0 auto; max-width: 90%;}
.wpPage .imgTile16 > div div { width: calc(50% - 0.6rem);}
.wpPage .imgTileL,
.wpPage .imgTileR { padding: 2rem 1.5rem;}
.wpPage .imgTileL > div > div,
.wpPage .imgTileR > div > div { margin: 0 0.5rem; width: calc(50% - 1rem);}
.wpPage .imgTileL > div > div:last-child div,
.wpPage .imgTileR > div > div:first-child div { margin: 0 0 1rem;}

.wpPage .btns { margin: 0 auto; max-width: 130rem; text-align: center;}
.wpPage .btns .btn { margin: 0 2rem 4rem;}

.wpPage .tabChange { margin: 0 -0.5rem 1rem;}
.wpPage .tabChange li { margin: 0 0.5rem 1rem; padding: 0.5rem 1rem; width: calc(50% - 1rem); font-size: 1.6rem; line-height: 1.2; text-align: center; border: 1px solid #333; transition: all ease 0.3s;}
.wpPage .tabChange li:hover { background: #CCC;}
.wpPage .tabChange li.select { color: #FFF; background: #333;}
.wpPage .tabs { display: none; margin: 0;}

.wpPage .menuGroupA h4,
.wpPage .menuGroupB h4,
.wpPage .menuGroupC h4,
.wpPage .menuGroupD h4,
.wpPage .menuGroupE h4,
.wpPage .menuGroupF h4,
.wpPage .menuGroupG h4 { padding: 0 0 0.5rem; border-bottom: 1px solid #333;}
.wpPage .menuGroupA ul,
.wpPage .menuGroupB ul,
.wpPage .menuGroupD ul { margin: 0 -0.5rem/*-1rem*/;}
.wpPage .menuGroupA li,
.wpPage .menuGroupB li,
.wpPage .menuGroupC li,
.wpPage .menuGroupD li,
.wpPage .menuGroupE > div,
.wpPage .menuGroupF > div,
.wpPage .menuGroupG > div { margin: 0 0.5rem 1rem; width: calc(50% - 1rem);}
.wpPage .menuGroupA a,
.wpPage .menuGroupB a,
.wpPage .menuGroupC a,
.wpPage .menuGroupD a,
.wpPage .menuGroupE a,
.wpPage .menuGroupF a,
.wpPage .menuGroupG a { text-decoration: none;}
.wpPage .menuGroupA a:hover p,
.wpPage .menuGroupB a:hover p,
.wpPage .menuGroupC a:hover p,
.wpPage .menuGroupD a:hover p,
.wpPage .menuGroupE a:hover p,
.wpPage .menuGroupF a:hover p,
.wpPage .menuGroupG a:hover p { text-decoration: underline;}
.wpPage .menuGroupA li > div,
.wpPage .menuGroupA a > div,
.wpPage .menuGroupC li > div,
.wpPage .menuGroupC a > div { margin: 0 0.5rem 0 0; width: 25%;}
.wpPage .menuGroupA li > div,
.wpPage .menuGroupA .enlargeImg,
.wpPage .menuGroupB li > div,
.wpPage .menuGroupB .enlargeImg,
.wpPage .menuGroupC li > div,
.wpPage .menuGroupC .enlargeImg,
.wpPage .menuGroupD li > div,
.wpPage .menuGroupD .enlargeImg,
.wpPage .menuGroupE li > div,
.wpPage .menuGroupE .enlargeImg,
.wpPage .menuGroupF li > div,
.wpPage .menuGroupF .enlargeImg,
.wpPage .menuGroupG li > div,
.wpPage .menuGroupG .enlargeImg { border-radius: 99rem; overflow: hidden;}
.wpPage .menuGroupA p { width: calc(75% - 0.5rem); font-size: 1.2rem;}
.wpPage .menuGroupB li,
.wpPage .menuGroupD li { width: calc(33.33% - 1rem);}
.wpPage .menuGroupB li > div,
.wpPage .menuGroupB a > div,
.wpPage .menuGroupD li > div,
.wpPage .menuGroupD a > div { margin: 0 0.5rem 0 0; width: 39%;}
.wpPage .menuGroupB p,
.wpPage .menuGroupD p { width: calc(61% - 0.5rem); font-size: 1.2rem;}
.wpPage .menuGroupC ul { margin: 0 auto -1rem; max-width: 90%;}
.wpPage .menuGroupC li > div,
.wpPage .menuGroupC a > div { margin: 0 0.5rem 0 0; width: 29%;}
.wpPage .menuGroupC p { width: calc(71% - 0.5rem); font-size: 1.2rem;}
.wpPage .menuGroupD li:nth-child(5n) { margin-right: 33.33%}
.wpPage .menuGroupE,
.wpPage .menuGroupF,
.wpPage .menuGroupG { margin: 0 -1rem 2rem;}
.wpPage .menuGroupE > div,
.wpPage .menuGroupF > div,
.wpPage .menuGroupG > div { margin: 0 1rem;}
.wpPage .menuGroupE ul,
.wpPage .menuGroupF ul,
.wpPage .menuGroupG ul { margin: 0 0 -1rem;}
.wpPage .menuGroupE li,
.wpPage .menuGroupF li,
.wpPage .menuGroupG li { margin: 0 0 1rem;}
.wpPage .menuGroupE li > div,
.wpPage .menuGroupE a > div,
.wpPage .menuGroupF li > div,
.wpPage .menuGroupF a > div { margin: 0 0.5rem 0 0; width: 26%;}
.wpPage .menuGroupE p,
.wpPage .menuGroupF p { width: calc(74% - 0.5rem); font-size: 1.2rem;}
.wpPage .menuGroupG > div { width: calc(33.33% - 2rem);}
.wpPage .menuGroupG li > div,
.wpPage .menuGroupG a > div { margin: 0 0.5rem 0 0; width: 41%;}
.wpPage .menuGroupG p { width: calc(59% - 0.5rem); font-size: 1.2rem;}

.wpPage .listGroup1 h4,
.wpPage .listGroup2 h4,
.wpPage .listGroup3 h4 { padding: 0 0 0.5rem; border-bottom: 1px solid #333;}
.wpPage .listGroup1 li,
.wpPage .listGroup2 li,
.wpPage .listGroup3 li { margin: 0 0 1rem 2rem; list-style: disc outside;}
.wpPage .listGroup2 > div,
.wpPage .listGroup3 > div { margin: 0 -1rem;}
.wpPage .listGroup2 ul,
.wpPage .listGroup3 ul { margin: 0 0 -1rem;}
.wpPage .listGroup2 > div div,
.wpPage .listGroup3 > div div { margin: 0 1rem; width: calc(50% - 2rem);}

.wpPage .registerWrap .beforeTable { margin: 0 0 1rem;}
.wpPage .registerWrap .beforeTable font { font-weight: bold;}
.wpPage .registerWrap th { padding-bottom: 0; font-weight: bold; border-bottom: none;}
.wpPage .registerWrap td .note { display: block; margin: 0.5rem 0 0; color: #5e96cf;}
.wpPage .registerWrap .submit { margin: 1rem 0 0; text-align: center;}
.wpPage .registerWrap .submit .inputWrap { margin: 1rem 1rem 0;}
.wpPage .registerWrap .submit .wpcf7-spinner { display: none;}

.questionnaire { margin: 2rem 0; padding: 2rem; background: #f1f5f9;}
.questionnaire h3 { margin: 0 0 1rem; text-align: center;}
.questionnaire dl { border-top: 1px solid #333;}
.questionnaire dt { padding: 1rem 0; font-weight: bold; line-height: 1.4;}
.questionnaire dd { padding: 0 0 1rem; line-height: 1.6; border-bottom: 1px solid #333;}

/* connect */
.connect input[type="checkbox"],
.connect input[type="radio"] { accent-color: #013161; inline-size: 2rem; block-size: 2rem;}
.connect label:hover input[type="checkbox"],
.connect label:hover input[type="radio"] { box-shadow: 0 2px 10px rgba(1, 49, 97, 0.2) !important; cursor: pointer;}
@media (hover: hover) {
.connect label:has(input[type="checkbox"]):hover,
.connect label:has(input[type="radio"]):hover { font-weight: bold;}
}
.connect label:has(input[type="checkbox"]:checked),
.connect label:has(input[type="radio"]:checked) { font-weight: bold;}

.connect .modalLink { cursor: pointer;}
.connect .modal { display: none; position: relative; z-index: 900; }
.connect .modalBG,
#zoomingDisplay { position: fixed; top: 0; left: 0; margin: 0; height: 100%; width: 100%; background: #001b36; opacity: .5; z-index: 999; }

.connect .modalBlock {
	position: fixed;
	top: 5vw;
	left: 50%;
	margin: -4rem 0 0;
	padding: 2rem;
	width: 90vw;
	height: auto;
	max-height: calc(100% - 10vw);
	background: #fff;
	box-shadow: 0 1rem 3rem rgba(1, 49, 97, 0.5);
	overflow: hidden;
	overflow-y: auto;
	z-index: 1000;
	transform: translateX(-50%);
	transition: all 0.3s ease-in-out;
}
.connect .modalBlock p { margin: 0 0 2rem; font-size: 1.6rem; text-align: left;}

.connect .modal .closeBtn { position: fixed; top: 0.5rem; right: 0.5rem; cursor: pointer; opacity: .6; z-index: 1000;}
.connect .modal .closeBtn a { display: block; padding: 0.5rem; width: 4rem; height: 4rem; background: #FFF;}
.connect .modal .closeBtn a:hover { cursor: pointer; -webkit-transform: rotate(-180deg); transform: rotate(-180deg); }
.connect .modal .closeBtn img { width: 100%; opacity: 1 !important;}

.connect .modal.show .modalBlock { margin-top: 0 !important; }

#connectHead { position: -webkit-sticky; position: sticky; top: 5.45rem; padding: 2rem 1.5rem; background: #E6EAEF; z-index: 100;}
#connectHead .connectTitle { margin-right: auto; font-size: 2rem;}
#connectHead .faqLink { font-size: 1.2rem;}
#connectHead .mypageLink { margin-left: 1.5rem; max-width: calc(100vw - 38rem); font-size: 1.3rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;}
#connectHead img { margin: 0 .5rem 0 0; width: 2.2rem; vertical-align: middle;}
#connectHead .btn { margin-left: 1.5rem; font-size: 1.2rem;}
#connectHead .btn img { position: relative; left: -0.2rem; margin: 0 .3rem 0 0;}
#connectHead .logout { padding: 0.6rem; font-size: 0;}
#connectHead .logout img { left: 0.1rem; margin: 0;}
#connectHead .cc { display: none;}

.connectTitle { font-size: 3rem; font-weight: bold;}
.connectTitle small { font-size: 1.4rem;}
.connectTitle + .center { line-height: 1.4;}
.connectTitle + .center strong { display: block; margin: 1rem auto 0; font-size: 2rem;}
.connectTitle:has(.cLogo) { line-height: 1;}
.connectTitle .cLogo { width: 19.6rem;}

.connectTitle ~ .flexList.whiteTitle { justify-content: center; margin-top: 3rem; margin-bottom: -2rem;}
.connectTitle ~ .flexList.whiteTitle figcaption { line-height: 1.4;}

#connectCat { margin: 3rem 0 2rem;}
#connectCat li { flex-grow: 1;}
#connectCat li:has(.narrowing) { display: none;}
#connectCat li a { display: block; font-size: min(1.6rem, 2.9vw); text-align: center; text-decoration: none; cursor: pointer;}
@media (hover: hover) {
#connectCat li:not(:has(.narrowing)) a:hover { background: rgba(1, 49, 97, 0.1); border-bottom-color: #000;}
}
#connectCat li .connectCat { padding: 1rem; color: #000 !important; font-weight: bold; border-bottom: 1px solid #999; opacity: .8;}
#connectCat li.select .connectCat { border-bottom-color: #000; box-shadow: 0 -1px 0 #000 inset; opacity: 1;}
#connectCat li .connectCat img { position: relative; top: -0.2rem; margin: 0 0 0 .7rem; width: 1.6rem; vertical-align: middle;}

#connectCatList { position: relative;}
#connectCatList .tabs:not(:first-of-type) { display: none;}

.connectCatDiv ul { margin: 0 -0.5rem; width: calc(100% + 1rem);}
.connectCatDiv li { margin: 0 0.5rem 1rem; width: calc(50% - 1rem);}
.connectCatDiv li a {
    display: block;
    padding: .5rem 0;
    color: #000 !important;
    font-size: min(1.7rem, 3vw);
    text-align: center;
    text-decoration: none;
    border: 1px solid #000;
    border-radius: .5rem;
}
.connectCatDiv li a.current { color: #FFF !important; background: #013161; border-color: transparent;}
.connectCatDiv li a:not(.current) { cursor: pointer;}
@media (hover: hover) {
.connectCatDiv li a:hover { background: #E6EAEF;}
}
#connectAreaDiv {
    position: absolute;
    top: -4rem;
    right: 0;
    max-height: 40rem;
    background: #FFF;
    border: 1px solid rgba(1, 49, 97, 0.2);
    box-shadow: 0 0 0.5rem rgba(1, 49, 97, 0.1);
    opacity: 0;
    overflow: auto;
    pointer-events: none;
    z-index: 10;
    transition: .3s;
}
#connectAreaDiv.active { top: -2rem; opacity: 1; pointer-events: auto;}
#connectAreaDiv a { display: block; padding: 1rem; text-decoration: none; cursor: pointer;}
#connectAreaDiv a.current { color: #FFF; background: #001b36;}
@media (hover: hover) {
#connectAreaDiv a:not(.current):hover { background: #E6EAEF;}
}

.connectNarrowDiv .narrowKeyword { background: url(/images/common/icon-searchB.svg) right 1rem center no-repeat; background-size: 2.4rem;}
.connectNarrowDiv h2 small { font-size: 1.6rem; font-weight: normal;}
.connectNarrowDiv h3 { padding: 1rem; font-size: 1.8rem; text-align: left; background: #E6EAEF;}
.connectNarrowDiv .narrowChecks { margin: 0 -0.5rem 1rem; width: calc(100% + 1rem);}
.connectNarrowDiv .narrowChecks label { margin: 0 0.5rem 1rem; min-width: calc(50% - 1rem); }
.connectNarrowDiv .narrowPrice { margin: 0 0 2rem; text-align: center;}
.connectNarrowDiv .narrowPrice input { margin: 0 0.5rem 0 0; width: 15rem;}
.connectNarrowDiv .narrowArea select { width: 100%;}
.connectNarrowDiv p.center { margin: 3rem 0 1rem;}
.connectNarrowDiv .btn small { font-size: 1.4rem; font-weight: normal;}

.afterLoad { opacity: 0; transition: 1s; transition-delay: .3s;}
.afterLoad.loaded { opacity: 1;}

.connect .paging { padding: 0;}
.connect .paging .paged { margin-right: auto;}
.connect .paging select { border-color: transparent !important;}
.connect .paging .imgDisplay { padding: 1.5rem 0; width: 100%; text-align: right;}
.connect .paging .imgDisplay .btn { margin: 0 0 0 1rem; font-size: 1.6rem;}
.connect .paging .imgDisplay .btn img { margin: -0.1rem 0.8rem 0 0; width: 2.2rem; vertical-align: middle;}

.connect .pager { font-size: 1.8rem;}

.connect .flexList figcaption { font-size: 1.6rem; line-height: 1.2; font-weight: bold;}
.connect .flexList .ctProf { display: flex; align-items: center; margin: 0.5rem 1rem 0;}
.connect .flexList .ctProf .cdProf { margin: 0 1rem 0 0; width: min(8rem, 8vw); min-width: min(8rem, 8vw); height: min(8rem, 8vw);}
.connect .flexList .ctProf p { font-size: 1.4rem; line-height: 1.2;}

@media (hover: hover) {
.connect .flexList .ctProf:hover { opacity: .6;}
}

.clMemList { margin: 0 0 2rem; padding: 0 0 2rem; border-bottom: 1px solid #9fb1c3;}
.clMemList:last-of-type { margin: 0 0 1rem; border-color: #000;}
.clMemList h4 {
    text-align: left;
	display: -webkit-box;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 3;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: normal;
    word-break: break-word;
}
.clMemList h4 a { text-decoration: none;}
.clMemList h5 { margin: 0 0 1rem; font-size: 1.4rem;}
.clMemList .cdCategory { margin-bottom: 0.5rem;}
.clMemBlock { margin: 0 0 2rem; width: 100%;}
.clMemBlock .cdProf { margin: 0 2rem 0 0; min-width: min(20rem, 30vw);}
.clMemBlock .cdProf a { transition: .3s;}
.clMemDetail { margin: 0 0 2rem;}
.clMemText {
	font-size: 1.4rem;
	line-height: 1.6;
	display: -webkit-box;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 9;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: normal;
    word-break: break-word;
}
.clMemPrices { margin: 0 0 2rem;}
.clMemPrice { margin: 1.5rem 0 0; text-align: right;}
.clMemList .cdCategory {
    margin: 0 -.75rem 1.5rem;
    width: calc(100% + 1.5rem);
	display: -webkit-box;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 3;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: normal;
}
.clMemList .cdCategory li { display: inline-block; margin: 0 .75rem 1.5rem;}
@media (hover: hover) {
.clMemBlock .cdProf a:hover { opacity: .6;}
.clMemList h4 a:hover { text-decoration: underline;}
}

#connectSpecial .rightBtn a { position: relative; text-decoration: none; z-index: 1;}
#connectSpecial .rightBtn img { position: relative; top: -0.2rem; margin: 0 0 0 0.5rem; width: 1.6rem; vertical-align: middle;}

#connectSpecialList { margin: -1rem 0 -3rem;}
#connectSpecialList li { margin: 2rem 0 0; width: 100%;}
@media (hover: hover) {
#connectSpecial .rightBtn a:hover { text-decoration: underline;}
#connectSpecialList  a:hover { opacity: .6;}
}

#fixBtns .btn.narrowing {
    padding: 5.3rem 0 0 !important;
    background-image: url("/images/common/icon-setting.svg");
    background-position: center 1.4rem;
    background-size: 3.4rem;
    border-radius: 50%;
}
#fixBtns .btn.narrowing:after { border-radius: 50%; border-width: 2px;}
#fixBtns .btn.narrowing.white {
    padding: 4.8rem 0 0 !important;
    line-height: 1.2;
    background-color: #FFF;
    background-image: url("/images/common/icon-close.svg");
    background-position: center 1rem;

}

.zooming { cursor: pointer; transition: .3s;}
figure:has(img.zooming) { position: relative;}
figure:has(img.zooming)::after {
    content: "";
    position: absolute;
    bottom: 1rem;
    right: 1rem;
    width: 4rem;
    height: 4rem;
    background: rgba(255, 255, 255, 0.5) url("/images/common/icon-zoom.svg") center no-repeat;
    background-size: 2.6rem;
    border-radius: 50%;
    cursor: pointer;
    pointer-events: none;
    z-index: 1;
}
figure:has(img.zooming):has(ul)::after { display: none;}
#zoomingDisplay {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 5%;
    background: rgba(0, 27, 54, .5);
    opacity: 0;
    pointer-events: none;
    transition: .3s;
}
#zoomingDisplay.active { opacity: 1; pointer-events: auto;}
@media (hover: hover) {
.zooming:hover { opacity: .6;}
#zoomingDisplay .zooming:hover { opacity: 1;}
}

.cdTitle { text-align: left;}
.cdSubtitle { margin: -1rem 0 2rem; font-size: 1.8rem !important; font-weight: normal; text-align: left;}
.cdTitle ~ p { margin: 0 0 2rem; line-height: 1.6;}

#cdSlides { position: relative; margin: 0 0 3rem; text-align: center;}
#cdSlides p { margin: 1.5rem 0 0; font-size: 2rem; text-align: right;}
#cdSlide { margin: 0 0 1rem;}
#cdSlide li { text-align: center;}
#cdSlide img { max-height: calc(100vw - 4rem);}
#cdSlide figure { z-index: 15;}
#cdSlide figure:has(img.zooming)::after { z-index: 15;}

#cdSlide .slick-track { display: flex; align-items: center;}
#cdSlide .slick-dots { position: absolute; left: 50%; bottom: 1rem; z-index: 5; transform: translateX(-50%);}
#cdSlide .slick-dots li { display: inline-block; margin: 0 1px; width: auto; height: auto; min-height: 0; font-size: 0; }
#cdSlide .slick-dots button {
    display: block;
    width: 20px;
    height: 20px;
    font-size: 0;
    background: none;
    border: none;
    cursor: pointer;
    opacity: .6;
    outline: none;
    transition: 0.3s;
}
#cdSlide .slick-dots button:before,
#cdSlide .slick-dots button:after {
    content: "";
    display: block;
    position: absolute;
    top: 5px;
    left: 5px;
    width: 10px;
    height: 10px;
    background: rgba(0, 0, 0, 0.2);
    border-radius: 8px;
    transition: all 0.3s ease;
}
#cdSlide .slick-dots button:after { background: none;}
#cdSlide .slick-dots button:hover { opacity: 1; }
#cdSlide .slick-dots button:hover:before, 
#cdSlide .slick-dots .slick-active button:before { background: rgba(0, 0, 0, 0.7);}
#cdSlide .slick-dots button:hover:after,
#cdSlide .slick-dots .slick-active button:after { border: 0.5px solid rgba(0, 0, 0, 0.7); transform: scale(2);}

#cdSlideNav li { margin: 0 0.5rem; width: calc(16.666% - 1rem); cursor: pointer;}
#cdSlideNav li:first-child { margin-left: 0;}
#cdSlideNav li:last-child { margin-right: 0;}
#cdSlideNav .slick-track { display: flex; justify-content: center; width: 100% !important; transform: none !important;}
#cdSlideNav .slick-current img { opacity: .6;}

@media (hover: hover) {
#cdSlideNav li:hover img { opacity: .8;}
}
#cdSlideNav .slick-list { padding: 0 !important;}

.cdLinks { margin: 3rem 0 0; padding: 3rem 2rem; border: 1px solid #DDD;}
.cdLinks h2 { margin: 0 0 1rem !important;}
.cdLinks a:not(.btn) { text-decoration: none; word-break: break-all;}
.cdLinks .btn { margin: 2rem 1rem 0;}
.cdLinks .btn img { position: relative; top: -0.1rem; margin: 0 .5rem 0 0; width: 2.6rem; vertical-align: middle;}

@media (hover: hover) {
.cdLinks a:not(.btn):hover { opacity: .6;}
}
.cdProf { margin: 0 auto 2rem; padding: 0 !important; width: min(20rem, 30vw); height: min(20rem, 30vw); border-radius: 50%; overflow: hidden;}
.cdProf img { width: 100%; height: 100%; object-fit: cover;}

#connectOthers .flexList { margin: 0 0 -2rem;}

.cdShop { margin: 0 0 4rem;}
.cdShop .cdNames { text-align: center;}
.cdShop .cdNames p { margin: 2rem 0 0;}
.cdShop strong { display: block; font-size: 2rem;}
.cdShop .cdCategory { justify-content: center; margin: 2rem -0.5rem 0;}
.cdShop .cdCategory li { margin: 0 0.5rem 1rem; font-size: 1.4rem;}
.cdShop p { text-align: center;}
.cdShop .btn { margin: 1rem auto 0;}
.cdShop .btn img { position: relative; top: -0.1rem; margin: 0 .5rem 0 0; width: 2.6rem; vertical-align: middle;}
.cdShop ~ p { margin: 0 0 4rem; line-height: 1.6;}
.cdShop ~ p mark { font-size: 110%;}

main section.cdTopSection h2.left { font-size: 2rem;}

.cdCategory { margin: 0 -0.75rem 2.5rem; width: calc(100% + 1.5rem);}
.cdCategory li { margin: 0 .75rem 1.5rem; padding: .5rem 1.5rem; font-size: 1.8rem; border: 1px solid #a3a2c8; border-radius: .5rem;}
.iconsLinks a { display: inline-block; text-decoration: none; word-break: break-word;}
.iconsLinks a ~ a { margin: 1.5rem 0 0;}
.iconsLinks img { position: relative; top: -0.1rem; margin: 0 1rem 0 0; width: 2.8rem; vertical-align: middle;}

@media (hover: hover) {
.iconsLinks a:hover { text-decoration: underline;}
}

.cfTitle { text-align: left;}
.cfTitle:has(figure) { font-weight: normal;}
.cfTitle .cdProf {  margin: 0 1rem 0 0; width: 8rem; min-width: 8rem; height: 8rem;}

.cfTitle ~ p { margin: 0 0 2rem; line-height: 1.6;}

.cfMemo { margin: 3rem 0; padding: 3rem 2rem; background: #f1f5f9;}
.cfMemo h2 { margin: 0 0 1.5rem !important; font-size: 1.8rem;}
.cfMemo .bordered { margin: 2rem 0 0; padding: 2rem 0 0; border-top: 1px dashed #749FC3;}
.cfMemo p { margin: 1.5rem 0; line-height: 1.4;}

.cfLink  img { display: inline-block; position: relative; top: 0; margin: 0 0.5rem 0 0; width: 1.7rem; vertical-align: middle;}

.connectForm dl { margin: 0 0 4rem; padding: 2rem 0 0; font-size: 1.8rem; text-align: left; border-top: 1px solid #000; border-bottom: 1px solid #000;}
.connectForm dt { position: relative; margin: 0 0 1rem; font-weight: bold; line-height: 1.4;}
.connectForm dt::after,
.privacyCheck label::after,
.connectFormMini dt::after {
	content: "任意";
	display: inline-block;
	position: relative;
	top: -2px;
	margin: 0 0 0 .8rem;
	padding: .5rem .8rem;
	right: 0;
	color: #555;
	font-size: 1.2rem;
	font-weight: normal;
	background: #DDD;
}
.connectForm dt.required::after,
.privacyCheck label::after,
.connectFormMini dt.required::after { content: "必須"; color: #FFF; background: #F00;}
.connectForm dt.noInput::after { content: "固定"; color: #013161; background: #f1f5f9;}
.privacyCheck label::after { display: inline-block; position: relative; top: -.3rem; margin: 0 0 0 1rem;}
.connectForm dd { position: relative; margin: 0 0 2rem; word-break: break-word;}
.connectForm dd span { position: relative;}
.connectForm dd.password { text-align: right;}
.connectForm dd.password label { margin: 1rem 0 0;}
.connectForm .zipNum input { max-width: 20rem;}
.connectForm .addDetail span { display: block; margin: 1.5rem 0 1rem;}
.connectForm .telNum input { width: 20rem;}
.cautionBefore {
	margin: 1.5rem 0 0;
	padding: 0 0 0 2.6rem;
	color: #F00;
	font-weight: bold;
	background: url(/images/common/icon-alert.svg) left center no-repeat;
	background-size: auto 2.2rem;
}
dd .cautionBefore { text-align: left !important;}
.cautionBefore.center { display: inline-block; width: auto;}
.cautionTip {
	position: absolute;
    bottom: 5rem;
    right: 0;
    padding: .8rem 1rem .5rem;
    max-width: 70%;
	color: #FFF;
	line-height: 1.2;
	text-align: center;
	background: #013161;
	border-radius: 4px;
	opacity: .8;
}
.cautionTip:before {
	content: "";
	position: absolute;
    bottom: -2.3rem;
    right: calc(50% - 1rem);
	border: 1rem solid transparent;
	border-top: 1.5rem solid #013161;
}
.cautionTip.red { background: #F00;}
.cautionTip.red:before { border-top-color: #F00;}

.cautionDiv,
.attention {
	margin: 2rem 0;
	padding: 2rem 2rem 2rem 6rem;
	color: #F00;
    line-height: 1.4;
	background: #fff1f1 url(/images/common/icon-exclamation.svg) 1.5rem center no-repeat;
	background-size: auto 3.2rem;
}
.attention { margin: 1rem 0 0; color: #001b36; background-color: #ecf7fe; background-image: url(/images/common/icon-exclamationB.svg);}

.attention.news { margin: 0 0 2rem; padding: 2rem; background-image: none;}
.attention.news h3 { margin: 0 0 1rem;}
.attention.news h3 img { position: relative; top: -0.2rem; margin: 0 0.3rem 0 0; width: 2.8rem; vertical-align: middle;}
.attention.news p { line-height: 1.6;}

.upImg {
	display: block;
	position: relative;
	padding: 11rem 2rem 3rem;
	text-align: center;
	border: 2px dashed rgba(191, 205, 219, 0.8);
	transition: .3s;
}
.upImg::after {
	content: "";
	position: absolute;
	top: 2rem;
	left: calc(50% - 4rem);
	width: 8rem;
	height: 8rem;
	background: url("/images/common/icon-image.svg") center no-repeat;
	background-size: contain;
	opacity: .2;
}
.upImg input { display: none;}
.upImg .btn { margin: 1rem auto 0;}
.upImg .kome { display: block; margin: 2rem 0 0;}
@media (hover: hover) {
.upImg:hover { background: #f1f5f9;}
.upImg:hover .btn:after { top: 0.2rem; left: 0.2rem; width: calc(100% - 0.4rem); height: calc(100% - 0.4rem);}
.upImg:hover .btn .icon.plus { left: 0; -webkit-transform: rotate(180deg); transform: rotate(180deg);}
}

.fileName { display: inline-block; margin: 2rem 2rem 0 0; text-align: center;}
.fileName .imgSum { margin: 0 0 1rem; width: 12rem; height: 12rem; vertical-align: middle;}
.fileName .imgSum:before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    box-shadow: 0 0 0 1px rgba(191, 205, 219, 0.8) inset;
    pointer-events: none;
    transition: .3s;
    z-index: 1;
}
.fileName .imgSum:has(img.zooming)::after { width: 3rem; height: 3rem; background-color: rgba(255, 255, 255, 0.7); background-size: 2.2rem;}
.fileName .imgSum.round { border-radius: 50%; overflow: hidden;}
.fileName .imgSum.round::before{ display: none;}
.fileName img { width: 100%; height: 100%; object-fit: contain;}
.fileName .btn { min-width: 0 !important;}

@media (hover: hover) {
.fileName .imgSum:has(img.zooming):hover::before { opacity: .6;}
}
.connectForm dd.choise { margin: 0 -2rem 1rem 0;}
.connectForm dd.choise h2 { margin: 0 0 1rem; padding: 0 0 0 1.5rem; font-size: 1.8rem; line-height: 1; text-align: left;}
.connectForm dd.choise h2 ~ h2 { margin: 1rem 0;}
.connectForm dd.choise h2::before {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	width: 0.5rem;
	height: 100%;
    background: #9fb1c3;
}
.connectForm dd.choise:last-of-type { margin-bottom: 1rem; padding-bottom: 0; border: none;}
.connectForm dd.choise label { margin: .5rem 2rem 1rem 0; min-width: calc(33.33% - 2.4rem);}
.connectForm dd.choise .attention { margin: 0 0 2rem !important; width: calc(100% - 2rem);}

.connectForm .cfPrice input { margin: 0 0.5rem 0 0; width: 15rem;}
.connectForm .cfDate input { margin: 0 0.5rem 0 0; width: 21rem;}
.connectForm .cfDate input ~ input { margin: 0 0.5rem;}

.privacyText { margin: 0 0 3rem; padding: 2rem; height: 30rem; overflow: auto; background: #f1f5f9; border: 1px solid #000;}
.privacyText ~ .privacyText { margin-top: 3rem;}
.privacyText h4 { text-align: left;}
.privacyText h5 { font-size: 1.8rem; text-align: left;}
.privacyText p,
.privacyText li { margin: 0 0 2rem; line-height: 1.4;}
.privacyText hr { margin: 2rem 0; border-bottom: 1px dashed #000; z-index: 1;}

.privacyText.news h3 { font-size: 2.4rem;}
.privacyText.news h4 { font-size: 2.2rem;}
.privacyText.news h4 ~ h4 { margin-top: 4rem;}
.privacyText.news h5 { margin: 0 0 1rem 2rem;}
.privacyText.news h5::before { content: "・"; position: absolute; left: -2rem;}
.privacyText.news p { margin: 0 0 2rem 2rem;}

.connectForm .btns { margin: 3rem 0 0;}
.connectForm .btns .btn ~ .btn { margin: 0 0 0 2rem;}
.connectForm .btns .btn.darkred img { position: relative; top: -0.1rem; margin: 0 0 0 0.5rem; width: 2.2rem;}

.connectForm .btns ~ .btns { margin: 3rem 0 0; padding: 3rem 0 0; border-top: 1px dashed #749FC3;}

.connectForm.conf dd { padding-bottom: 1rem; min-height: 4rem; line-height: 1.6; border-bottom: 1px solid #9fb1c3;}
.connectForm.conf dd:last-of-type { margin-bottom: 0; border: none;}
.connectForm.conf .fileName { margin: 0 1rem 1rem 0;}
.connectForm.conf .fileName .imgSum { margin: 0;}
.connectForm.conf dd.choise { margin-right: 0;}
.connectForm.conf dd.choise:last-of-type { margin-bottom: 2rem;}
.connectForm.conf dd.choise h2 ~ h2 { margin: 2rem 0 1rem;}

.connectForm.comp { min-height: calc(100vh - 50rem); min-height: calc(100dvh - 50rem);}
.compText { margin: 3rem 0 6rem !important; line-height: 1.6; text-align: center;}

.connectFormMini dt,
.connectFormMini dd { position: relative; margin: 0 0 0.5rem; text-align: left;}
.connectFormMini dd { margin: 0 0 2rem;}

#connectLogin p { margin: 2rem 0 0; line-height: 1.4;}
#connectLogin .membered,
#connectLogin .notMembered,
#connectRemind { margin: 0 auto; max-width: max(65%, 50rem);}
#connectRemind { min-height: calc(100vh - 54.8rem); min-height: calc(100dvh - 54.8rem);}
#connectLogin .membered { margin-bottom: 4rem; text-align: center;}
#connectLogin .notMembered {
    padding: 3rem 2rem;
    background-size: auto auto;
    background-color: #f1f5f9;
    background-image: -webkit-repeating-linear-gradient(45deg, #f1f5f9, #f1f5f9 12px, #edf0f4 12px, #edf0f4 14px);
    background-image: repeating-linear-gradient(45deg, #f1f5f9, #f1f5f9 12px, #edf0f4 12px, #edf0f4 14px);
}
#connectLogin .notMembered h3 { margin: 2.5rem 0 2rem; padding: 2rem 0 0; border-top: 1px dashed #749FC3;}
#connectLogin .notMembered .br { display: inline;}

#connectRemind p { line-height: 1.4;}
#connectRemind .connectFormMini,
#connectRemind .center { margin: 3rem 0 0;}
#connectRemind .bordered { margin: 3rem 0 0; padding: 3.5rem 0 0; border-top: 1px dashed #749FC3;}
#connectRemind .btn ~ .btn { margin-left: 3rem;}

.cmTop { margin: 0 -2rem;}
.cmTop .cfTitle { margin: 0 2rem 2rem; width: 100%;}
.cmTop .btns { order: -1; margin: -1rem 0 1rem; padding: 1rem 2rem; min-width: 100%; text-align: right; white-space: nowrap; overflow: auto;}
.cmTop .btn { min-width: 0;}
.cmTop .btn ~ .btn { margin-left: 1.5rem;}
.cmTop .btn img { display: inline-block; position: relative; top: -0.2rem; margin: 0 0.5rem 0 0; width: 2.4rem; vertical-align: middle;}

.cmTop.short { margin: 0 0 2rem; justify-content: space-between; flex-wrap: nowrap;}
.cmTop.short .cfTitle,
.cmTop.short .btns { order: 0; margin: 0; padding: 0; width: auto; min-width: 0; overflow: visible;}
.cmTop.short .cfTitle { margin: 1rem 0 0;}

.connect .connectMypage .paging { margin: 2rem 0 0; border: none;}
.connect .connectMypage .paged { order: -2; margin: 0 auto 2rem 0;}
.connect .connectMypage .select { order: -1; margin: 0 0 2rem auto;}
.connect .connectMypage .pager { width: 100%; border: none;}

.connect .connectMypage .paging.down { margin: 1rem 0 0;}
.connect .connectMypage .paging.down .paged,
.connect .connectMypage .paging.down .select { margin-bottom: 0;}
.connect .connectMypage .paging.down .pager { order: -3; margin: 0 0 1rem;}

.connectMypage .scroll { margin: 0 -2rem; padding: 0 2rem; overflow: auto;}

#cmList { display: table; min-width: 80rem; height: 100%; border-top: none; border-bottom: 1px solid #333;}
#cmList tr { transition: background .3s;}
#cmList th,
#cmList td { display: table-cell; border-bottom: 1px solid #9fb1c3;}
#cmList thead tr:last-of-type th,
#cmList thead tr:last-of-type td { border: none; box-shadow: 0 1px 0 0 #333 inset, 0 -1px 0 0 #333 inset;}
#cmList tbody tr:last-of-type th,
#cmList tbody tr:last-of-type td { border: none;}
#cmList thead { white-space: nowrap;}
#cmList thead th,
#cmList thead th ~ td { padding: 1rem 3rem 1rem 1rem;}
#cmList td:first-child { height: 100%;}
#cmList td label { display: flex; align-items: center; width: 100%; height: 100%;}
#cmList td label input { margin: 0;}
#cmList thead th div { font-size: 1.6rem;}
#cmList .sort { display: inline-block; margin: 0 0 0 1rem; vertical-align: middle; cursor: pointer; opacity: .4;}
#cmList .sort ~.sort { margin: 0 0 0 .3rem;}
#cmList .sort.active { opacity: 1;}
#cmList .sort img { margin: 0; width: 1rem;}
#cmList tbody td { text-align: center;}

#cmList .cmTitles .btn.gray { margin: 0 2rem 0 0; width: 13rem;}
#cmList .cmTitles figure { margin: 0 2rem 0 0; width: min(16rem, 20vw); min-width: min(16rem, 20vw);}
#cmList .cmTitles figure img { margin: 0; width: 100%;}
@media (hover: hover) {
#cmList tbody tr:has(a.cmTitles:hover) { background: rgba(1, 49, 97, 0.05);}
#cmList a.sort:hover { opacity: 1;}
#cmList a.cmTitles:hover figure img { opacity: .6;}
}

#cmNews { margin: 2rem 0; padding: 2rem; background: #f1f5f9;}
#cmNews h2 { margin: 0 0 1rem !important;}
#cmNews #cmNewsList li { border-bottom: 1px solid #b5bec7;}
#cmNews #cmNewsList li:last-child { margin: 0 !important; border: none;}
#cmNews .cmNewsLink { display: block; padding: 1rem 0; text-decoration: none;}
#cmNews .cmNewsLink span { display: block; font-size: 1.4rem;}
#cmNews .cmNewsLink strong { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;}
#cmNews .cmNewsLink p,
#cmNews .cmName .cdNames a:not(.btn) {
	line-height: 1.6;
	display: -webkit-box;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 1;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: normal;
    word-break: break-word;
}
#cmNews .center { margin: 1rem 0 0;}

#cmNews .cmName { display: flex; align-items: center; margin: 1rem 0 0;}
#cmNews .cmName .cdProf { margin: 0 1.5rem 0 0; width: 6rem; height: 6rem; min-width: 6rem; min-height: 6rem;}
#cmNews .cmName .cdNames { display: flex; align-items: center; flex-grow: 1;}
#cmNews .cmName .cdNames a:not(.btn) { margin: 0 1.5rem 0 0; -webkit-line-clamp: 3;}
#cmNews .cmName .btn { margin: 0 0 0 auto; min-width: 16rem; white-space: nowrap;}
#cmNews .cmName .btn.small img { margin: 0 0.5rem 0 0; width: 2rem; vertical-align: middle;}

#cmNews .cmNewsDetail h2 { text-align: left;}
#cmNews .cmNewsDetail p { margin: 0; font-size: 1.6rem; line-height: 1.6;}
#cmNews .cmNewsDetail p.cmNewsDate { margin: 0 0 1rem;}
#cmNews .cmNewsDetail p.cmUrl { margin: 1rem 0 2rem;}
#cmNews .cmNewsDetail p.cmUrl img { margin: 0 1rem 0 0; width: 2rem; vertical-align: middle;}

#cmNews.all { margin: 0; padding: 0; background: none;}
#cmNews.all #cmNewsList { border-top: 1px solid #b5bec7; border-bottom: 1px solid #b5bec7;}
#cmNews.all #cmNewsList,
#cmNews.all #cmNewsList li { border-color: #000;}
#cmNews.all .cmNewsLink strong { overflow: visible; text-overflow: none; white-space: normal;}
#cmNews.all .cmNewsLink p { -webkit-line-clamp: 3;}
@media (hover: hover) {
#cmNews .cmNewsLink:hover { background: #FFF;}
#cmNews.all .cmNewsLink:hover { background: rgba(1, 49, 97, 0.05);}
#cmNews .cmName .cdProf a:hover { opacity: .6;}
}
#cmNews .paging { margin: 1rem 0 0; border: none;}
#cmNews .paging .paged { order: -2;}
#cmNews .paging .select { order: -1;}
#cmNews .paging .pager { padding: 1rem 0 0; width: 100%; border: none;}

@media screen and (max-width: 370px){

/* base */

/* common */

/* page */
#connectHead .login { padding: 0.6rem; font-size: 0;}
#connectHead .login img { left: 0.1rem; margin: 0;}
}

@media screen and (min-width: 768px){

/* base */

/* common */

/* page */
#mainSlide li img { max-height: 65rem;}

#catSide .sideDd label { min-width: calc(24% - 2rem);}

.detail .itemList li { width: calc(33.33% - 2rem);}

main .companyCns { background-size: auto 100%;}
main .companyCns .section { padding-bottom: 15rem;}
/* 220822 修正対応 main .companyCns h3,
main .companyCns p { max-width: 66%;}*/


main .companyOas,
main .companyHad { background-size: auto 100%;}
main .companyOas p { margin-left: auto; max-width: 66%;}
main .companyHad p { margin-right: auto; max-width: 66%;}

main .companyOss01 { background-size: 45% auto;}
main .companyOss02 { background-size: 60% auto;}
main .companyOss01 h2,
main .companyOss01 h3,
main .companyOss01 h4,
main .companyOss01 p,
main .companyOss02 h3,
main .companyOss02 h4,
main .companyOss02 p { margin-left: auto; max-width: 66%; text-align: left;}

main .companyOss03 { background-size: auto 100%;}
main .companyOss04 { background-size: auto 60%;}
main .companyOss03 h3,
main .companyOss03 h4,
main .companyOss03 p,
main .companyOss04 h3,
main .companyOss04 h4,
main .companyOss04 p { margin-right: auto; max-width: 66%;}

main .companyAwr01 { background-size: 55% auto;}
main .companyAwr01 h2,
main .companyAwr01 .section > p { margin-left: auto; max-width: 66%; text-align: left;}
main .companyAwr01 h3 { margin-left: auto; max-width: 66%;}
main .companyAwr01 .shops { display: flex; flex-wrap: wrap; justify-content: flex-end; margin: 0 -1rem; width: calc(100% + 2rem);}
main .companyAwr01 .shops > div { margin: 2rem 1rem 0;}
main .companyAwr01 .shops > .logoImg { margin: 2rem 1rem 0 5rem;}
main .companyAwr01 .logoImg img { max-width: 14rem;}
main .companyAwr01 .shops > .shopText { width: calc(66% - 18rem);}
main .companyAwr01 .shops > .tripleHalf { width: calc(33.33% - 2rem);}

main .companyAwr02 { background-size: 50% auto;}
main .companyAwr03 { background-size: 60% auto;}
main .companyEdu { background-size: 55% auto;}
main .companyAwr02 .section { padding-bottom: 10rem;}
main .companyAwr03 .section { padding-top: 10rem;}
main .companyAwr02 p,
main .companyAwr03 p { margin-right: auto; max-width: 50%;}
main .companyEdu p { margin-right: auto; max-width: 66%;}

main .companyFal {background-size: 100% auto;}
main .companyFal .section { padding-bottom: 60%;}

main .companyAbt .section { display: flex; flex-wrap: wrap; margin: 0 -1rem; width: calc(100% + 2rem);}
main .companyAbt .section div { margin: 2rem 1rem 0;}
main .companyAbt .section .half { width: calc(50% - 2rem);}

main .companyAbt.access h2,
main .companyAbt.access .googleMap { width: calc(100% - 2rem);}

/* recruitNew */
main:has(#recruitNewTop)::before {
    top: 11rem;
    height: clamp(120rem, 75vw, 130rem);
    background-image: url(/images/company/image-recruit-pc.png);
    background-size: max(1920px, 100%) auto;
}
#recruitNewTop { padding-top: clamp(65rem, 40vw, 90rem);}
#recruitNewTop h1 { font-size: max(3rem, 1.5vw); line-height: 1.5;}
#recruitNewTop h1 strong { font-size: max(4.5rem, 2.5vw);}
#recruitNewTop p { margin: 6rem 0 0; font-size: 2.8rem; line-height: 1.8;}

.wpPage.recruitNewLinks h2 { margin: 0 0 6rem; font-size: 5rem;}
.wpPage.recruitNewLinks h2 span { padding: 0 3rem 0 0;}
.wpPage.recruitNewLinks h2::before { bottom: 0.6rem;}
.recruitLinks.flexList { display: flex; justify-content: center; margin-bottom: -4rem;}
.recruitLinks.flexList li { margin: 0 3rem 4rem; width: calc(50% - 6rem); max-width: 60rem;}
.recruitLinks.flexList a {
    padding: 4rem;
    max-width: none;
    font-size: 4rem;
    background-position: right 4rem center;
    background-size: 3.6rem;
}
.recruitLinks.flexList a:hover { background-position: right 3rem center;}

.recruitAbouts.flexList { margin: 0 -3rem -6rem;}
.recruitAbouts.flexList li { margin: 0 3rem 6rem; width: calc(33.33% - 6rem);}
.recruitAbouts.flexList figcaption { padding: min(5rem, 2vw);}
.recruitAbouts.flexList figcaption h3 { font-size: min(4.4rem, 2vw); font-weight: bold;}
.recruitAbouts.flexList figcaption h3 strong { font-size: min(6.5rem, 2.8vw);}
.recruitAbouts.flexList figcaption p { bottom: min(5rem, 2vw); right: min(5rem, 2vw); font-size: min(3.5rem, 1.8vw); font-weight: bold;}
.recruitAbouts.flexList figcaption img { top: -0.2rem; margin: 0 0 0 0.5rem; width: min(3.2rem, 1.6vw);}

.calendars { margin: 0 -2rem;}
.calendars div { padding: 0 2rem; width: 33.33%;}

#connectHead .mypageLink { max-width: calc(100vw - 47rem);}
#connectHead .logout { padding: 0.6rem 1.5rem; font-size: 1.3rem;}
#connectHead .logout img { left: 0; margin: 0 .3rem 0 0;}
#connectHead .cc { display: inline-block;}

.flexList.two li { width: calc(50% - 2rem);}

.connect .paging { padding: 0 0 2rem;}
.connect .paging .paged { font-size: 2rem;}
.connect .paging .imgDisplay { margin-left: 3rem;}
.connect .paging .imgDisplay { padding: 0 0; width: auto; text-align: right;}
.connect .paging .imgDisplay .btn { margin: 0 0 0 2rem; font-size: 1.8rem;}
.connect .paging .imgDisplay .btn img { margin: -0.3rem 1rem 0 0; width: 2.6rem;}
}


@media screen and (max-width:1023.9px) {

#topSection .flexList li,
#newCoordinate .flexList li,
.catMidList li { width: calc(33.33% - 2rem);}

#newsAndTopics .flexList li:nth-child(6) ~ li,
#campaigns li:nth-child(4) ~ li,
#newCoordinate li:nth-child(6) ~ li,
#originals li:nth-child(4) ~ li,
#customizes li:nth-child(4) ~ li { display: none;}

#topSection .flexList.topNav figcaption h3 { font-size: 1.6rem !important;}
#topSection .flexList.topNav figcaption p { font-size: 1.4rem !important;}

#connectAreaDiv { left: auto !important;}
}

@media print, screen and (min-width:1024px){

/*-------------------------------------
	base
-------------------------------------*/

/* base */
h1, h2, h3, h4, h5, h6 { margin: 0 auto 4rem; font-size: 4rem;}

th,
td { display: table-cell;}

/* form */
input.sizeLL { width: 50%;}
input.sizeL { width: 35%;}
input.sizeM { width: 20%; min-width: 26rem;}
input.sizeS { width: 10%; min-width: 10rem;}

textarea { height: 25rem;}

.errorMsg { margin: 0 0 4rem; padding: 2rem; font-size: 1.8rem;}

.btn { padding: 2rem 3rem 1.8rem; min-width: 22rem; font-size: 1.9rem;}

.btn .icon { top: -0.2rem; margin: 0 0 0 0.8rem; width: 1.6rem; height:1.6rem;}

.btn.small { padding: 1.4rem 2rem 1.2rem; min-width: 14rem; font-size: 1.6rem;}
.btn.small .icon { width: 1.4rem; height: 1.4rem;}

.btn.large { padding: 3rem 5rem 2.8rem; font-size: 2rem;}

/* header */
#headNav li.pc { display: none !important; }

/* aside */
#fixBtns { position: fixed; bottom: 2rem; right: 2rem;}
#fixBtns .btn { margin: 2rem 0 0; padding: 4rem 0 0; width: 11rem; height: 11rem; font-size: 1.6rem !important; line-height: 1.3 !important; background-position: center 1.2rem; background-size: 2.6rem;}
#fixBtns .btn.form { 
    padding: 6.5rem 0 0; 
    background-position: center 1.5rem; 
    background: /*20221215 濃色に変更指示 #b39e05*/ #885500 url(/images/common/icon-form.svg) center 1.2rem no-repeat !important;
    background-size: 4.5rem !important;
    }
#fixBtns .btn.chat { 
    padding: 6.5rem 0 0; 
    background-position: center 1.5rem; 
    background-size: 4.5rem;
    background-image: url(/images/common/icon-faq.svg);
    }
#fixBtns .btn.cart { 
    padding: 6rem 0 0; 
    font-size: 1.2rem; 
    background-position: center 1.5rem;
    background-image: url(/images/common/icon-cartW.svg);
    background-size: 4rem;
    }
 
@media print {
    aside { display: none;}
}
    
    /* footer */
footer { padding: 10rem 0; font-size: 1.6rem;}

#footWrap { display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; justify-content: center; margin: 0 auto; padding: 0 4rem; max-width: 184rem;}

#footLogo { width: 30rem; text-align: left;}
#footLogo img { margin: 0 0 0.8rem; height: 5rem;}
#footLogo strong { display: inline-block; width: 24rem; text-align: center;}

#footNav { margin: 0 0 4rem; width: calc(100% - 30rem);}
#footNav .acd { display: none !important; pointer-events: none;}
#footNav .acd-content { display: block !important; padding: 3rem 1rem 0; border-top: 1px solid #013161;}
#footNav .acd-content ul { display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap;}
#footNav .acd-content li { margin: 0 2rem 3rem; width: calc(50% - 4rem);}
#footNav .acd-content a { color: #013161 !important; text-decoration: none;}
#footNav .acd-content a:hover { text-decoration: underline;}

footer .snsLinks { margin: 0; width: 30rem; text-align: left;}

#copy { width: calc(100% - 30rem); font-size: 1.4rem; line-height: 2.4rem; text-align: right;}


/*-------------------------------------
	common
-------------------------------------*/

.pc { display: block !important; }
.sp { display: none !important; }

.rightBtn { margin: -9.5rem 0 4.5rem;}

main { padding: 11rem 0 0;}
main section { margin: 0 auto; padding: 4rem 4rem; max-width: 184rem; overflow: hidden;}
main section.gray { margin: 4rem 0; padding: 16rem 8rem; max-width: none;}
main section.gray h2 { padding: 0 4rem; max-width: 184rem;}
main h2.line { padding: 0 0 2rem;}

#iconNav { display: none;}

#breadCrumbs { margin: 0 auto; padding: 4rem; max-width: 184rem;}

/* flexList */
.flexList { margin: 0 -2rem;}
.flexList li { margin: 0 2rem 4rem; width: calc(33.33% - 4rem);}
.flexList figcaption { margin: 1rem 0 0; font-size: 1.8rem;}

.flexList.coordinate,
.flexList.catTopList { margin: 0 -2rem;}
.flexList.topNav li,
.flexList.coordinate li,
.flexList.catTopList li { margin: 0 2rem 4rem; width: calc(25% - 4rem);}
.flexList.coordinate figcaption { display: block;}

.flexList.two li { width: calc(50% - 4rem);}
.flexList.four li { width: calc(25% - 4rem);}
.flexList.five li { width: calc(20% - 4rem);}
.flexList.six li { width: calc(16.66% - 4rem);}
.flexList li figcaption h2,
.flexList li figcaption h3 { margin: 2rem 0 1.5rem !important;}
.flexList li figcaption h4,
.flexList li figcaption h5,
.flexList li figcaption h6 { margin: 1.5rem 0 1rem !important;}

.flexList.lineList { margin: 0 -3rem;}
.flexList.lineList li { margin: 0 3rem 6rem; width: calc(25% - 6rem);}
.flexList.lineList li a { padding: 0 0 2rem;}
.flexList.lineList figcaption { padding: 2rem 2rem 0;}

.flexList.whiteTitle figcaption { padding: 3rem 4rem 2.5rem; font-size: 2.2rem;}

/* catTitle */
.catTitle { margin: 0 0 6rem; padding: 0 0 4rem; font-size: 5rem;}

/* bannerLink */
.bannerLink { margin: -5rem 0; padding: 20rem 6rem;}
.bannerLink ~ .bannerLink { margin-top: 15rem;}
.bannerLink h3 { font-size: 4rem;}

.bannerLink.company { padding: 10rem 6rem; background-position: center bottom;}

/* category */
li .category { margin: 1rem 1rem 1.5rem 0;}


/*-------------------------------------
	page
-------------------------------------*/

/* top */
#topNotice { padding: 0;}
#topNotice p { margin: 0 auto; padding: 4rem; max-width: 184rem; font-size: 2rem; overflow: hidden;}

#MainVisual { margin: 0;}

#MainVisual li { height: calc(80vh - 5.5rem); min-height: 60rem;}
#MainVisual li .contents p { margin: 4rem 0 0; font-size: 1.8rem;}
#MainVisual .slick-arrow { width: 10vw; background-size: 5rem;}
#MainVisual .slick-dots { left: 5rem; bottom: 3rem;}
#MainVisual .slick-dots li { margin: 0 0.5rem;}

#topSection { margin: 0;}
#topSection > div,
#newCoordinate { margin: 0 auto; padding: 0 4rem; max-width: 184rem;}

.flexList.topNav figcaption h3 { margin: 0 0 1rem; font-size: 2rem;}
.flexList.topNav figcaption p { font-size: 1.8rem;}

#connectTop .connectTopImg { margin: 0 auto 10rem; max-width: none;}
#connectTop .connectTopImg img { max-width: none;}
#connectTop .connectTopImg + div { margin: 0 auto; padding: 0 4rem; max-width: 184rem;}

#connectList .ctProf { margin: 0; padding: 0 2rem 2rem;}
#connectList .ctProf .cdProf { margin: 0 2rem 0 0; width: min(8rem, 4vw); min-width: min(8rem, 4vw); height: min(8rem, 4vw);}
#connectList .ctProf p { font-size: 1.6rem;}

#infoList { padding: 3rem 0 0;}
#infoList li { margin: 0 0 3rem; padding: 0 3rem;}
#infoList a { font-size: 1.9rem;}
#infoList span { width: calc(100% - 12rem);}
#infoList .date { width: 12rem;}

.recommendSlide { position: relative; margin: 0;}
.recommendSlide .slick-slide { margin: 0 4rem 0 0; padding: 0 0 9rem;}
.recommendSlide .slick-slide figcaption { margin: 1rem 0 0; font-size: 1.6rem; line-height: 1.6;}
.recommendSlide .slick-arrow { width: 6rem; height: 6rem; background-size: 4rem;}
.recommendSlide .slick-next { left: 8rem;}
.recommendSlide .slick-dots { bottom: 2.9rem; left: 20rem; width: calc(83.33% - 20rem);}

.recommendSlide .slick-slider:has(.slick-dots li:first-child:last-child),
.recommendSlide .slick-slider:has(.slick-dots li:first-child:last-child) .slick-slide { padding-bottom: 0;}
.recommendSlide .slick-dots:has(li:first-child:last-child) { display: none;}

.recommendSlide + .center { margin: 4rem 0 0;}
.recommendSlide + .center .btn { width: auto;}

#keywordList { margin: 0 auto -2rem; padding: 0 1rem 0 4rem; max-width: 184rem;}
#keywordList li { margin: 2rem 3rem 2rem 0;}
#keywordList a { padding: 1rem 2.5rem; font-size: 1.9rem;}

#categoryList { margin: 0 -2rem -4rem;}
#categoryList .categoryL li { margin: 2rem 2rem 1rem; width: calc(33.33% - 4rem);}
#categoryList .categoryL h3 { margin: 0 0 3rem; padding: 0 0 3rem; font-size: 3.2rem; border-bottom: 1px solid #000;}
#categoryList .categoryL span { width: 100%;}
#categoryList .categoryM { display: block;}
#categoryList .categoryM li { margin: 0 0 3rem; width: 100%;}
#categoryList .categoryM a { display: -webkit-box; display: -ms-flexbox; display: flex; align-items: center; text-decoration: none; }
#categoryList .categoryM a:hover { text-decoration: underline;}
#categoryList .categoryM figure { margin: 0 2rem 0 0; width: 8rem; height: 8rem; overflow: hidden;}
#categoryList .categoryM span { width: calc(100% - 10rem); font-size: 1.9rem;}

#brandList { margin: 0 auto; max-width: 184rem;}
#brandList li { padding: 2rem 4rem; width: 33.33%;}
#brandList li:nth-child(2n) { border: none;}
#brandList li:nth-child(3n),
#brandList li:nth-child(3n-1) { border-left: 1px solid #000;}
#brandList li a { font-size: 1.9rem;}

/* category */
.category section:first-of-type { padding-top: 2rem;}
.category section:last-of-type { padding-bottom: 15rem;}
.category section:last-child .bannerLink { margin-bottom: 0;}

.catTop .rightBtn { display: block;}
.catTop .center { display: none;}

.catMidList.flexList figcaption { font-size: 1.6rem;}

.storeImg { margin: 0;}
.storeBtns { margin: 6rem 0 8rem;}
.storeBtns .btn { margin: 0 2rem; width: auto !important; vertical-align: top;}
.storeBtns .orBtnGroup { display: inline-block;}
.storeBtns .orBtnGroup .btn { margin-bottom: 1rem;}
.storeBtns .orBtnGroup small { display: block; margin-left: 2rem;}

#virtualStore { margin: 0;}

.virtualBtns .btn { margin: 4rem 2rem 0; width: auto;}

.calendars { margin: 0 -3rem;}
.calendars div { margin: 4rem 0 0; padding: 0 3rem;}

/* search */
#catFlex { margin: 0 auto; padding: 0 0 4rem 4rem; max-width: 184rem;}
#catSide { padding: 0 0 4rem; width: 40rem; border-right: 1px solid #CCC;}
/*#catSide #sidebox { position: -webkit-sticky; position: sticky; top: 13rem;}*/
#catSide .sideSearch { margin: 0 0 4rem; padding: 0 2rem 0 0;}
#catSide .acd.sideTitle { padding: 1.5rem 3.5rem 1.5rem 1.5rem; color: #333; font-weight: 900; background: none; border-bottom: 1px solid #333; cursor: auto; pointer-events: none;}
#catSide .acd.sideTitle:after { display: none;}
#catSide .sideCont { padding: 2rem 0 0;}
#catSide .sideDt { margin: 0; border: none; transition: all ease 0.3s;}
#catSide .sideDt:hover { background: rgba(1, 49, 97, 0.1);}
#catSide .sideDt:nth-last-child(2):not(.open) { margin: 1em 0 1em 1em;}
#catSide .sideDd,
#catSide .sideDd.prices { margin: 0 0 2rem;}
/*#catSide .sideDt.keyword { border-top: 1px solid #333;}*/
#catSide .sideDd.keyword .btn.small{ margin: 0 0 0 2rem; padding: 1rem 2rem; font-size: 1.4rem; min-width: 0;}
#catSide .sideDd label { min-width: calc(49% - 2rem);}
#catSide .center,
#catSide .sideDd ul { padding: 1rem 0 0;}

#catMain { width: calc(100% - 40rem);}
#catMain section { padding: 4rem;}
#catMain section:first-of-type { padding-top: 0;}

.search #catMain h1 + p { font-size: 2rem;}

.paging { margin: 4rem 0;}

.pager { padding: 0 0 2rem;}
.pager li { margin: 0 0.8rem;}
.pager a { width: 5rem; line-height: 5rem; font-size: 1.8rem;}
.pager.bottom { padding: 2rem 0 0;}

.itemList ul { margin: 0 -2rem;}
.itemList li { margin: 0 2rem 4rem; padding: 0 0 6rem; width: calc(25% - 4rem);}
.itemList li .icons .icon { font-size: 1.4rem;}
.itemList li .addBtn { margin: 1rem 0 0;}
.itemList li a:hover figcaption,
.itemList li .addBtn a:hover { opacity: .6;}

/* detail */
.detail section:first-of-type { padding-top: 0;}
.detail section:last-of-type { padding-bottom: 15rem;}
.detail h2.line + .right { margin: -10.2rem 0 6rem; font-size: 3rem;}
.detail h2.line + .right strong { font-size: 3rem;}
.detail h2.line + .right strong strong { font-size: 3.5rem;}
.detail .itemList ul { margin: 0 -2rem -4rem;}
.detail .itemList li { width: calc(25% - 4rem);}
.detail .itemList .center { margin: 1rem 0 0;}

#detailTop { display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap;}
#detailTop p.right { order: -2; margin: 0 0 4rem; padding: 0.2rem 0 0;}
#detailTop h1 { width: 100%;}
#detailTop #detailSlide { order: -1; width: 100%;}
#detailTop p { width: 100%; font-size: 1.8rem;}
#detailTop .slick-arrow { background-size: 4rem;}

#mainSlide li img { max-height: 80rem;}
#navSlide { margin: 0; width: 100%;}
#navSlide li img { max-height: 15rem;}
#navSlide .slick-track { margin: 2rem -1rem; width: calc(100% + 2rem) !important; transform: none !important;}
#navSlide .slick-slide { margin: 0 1rem 2rem; width: calc(16.66% - 2rem) !important;}
#navSlide .slick-cloned { display: none !important;}

#detailCont { padding: 0 0 0 6rem; width: 50%; font-size: 1.8rem;}
#detailCont h1 { font-size: 5.2rem;}
#detailCont h1 small { margin: 1rem 0 0;}
#detailCont .price { margin: 0 0 3rem; padding: 0 0 2rem; font-size: 3rem;}
#detailCont .price strong { font-size: 4rem;}
#detailCont dt,
#detailCont dd { margin: 0 0 1.5rem; width: 8rem;}
#detailCont dd { width: calc(100% - 8rem);}
#detailCont p { margin: 0 0 1.5rem; font-size: 1.8rem;}
#detailCont .addBtn { margin: 3rem 0 0;}
#detailCont .btn { margin: 2rem 0 0; font-size: 2.2rem;}
#detailCont .btn img { margin: 0 0.8rem 0 0; width: 3rem;}

#detailText { margin: 6rem 0 0; width: 100%;}
#detailText p { margin: 0 auto; max-width: 100rem; font-size: 1.8rem; line-height: 1.6;}

/* company */
main.company section { max-width: none;}
main.category.company section:last-of-type { padding-bottom: 0;}
main.company .section { margin: 0 auto; padding: 10rem 4rem; max-width: 184rem;}
main.company h2 { margin: 0 0 4rem;}
main.company h3 { margin: 0 0 4rem; font-size: 3rem;}
main.company h4 { margin: 0 0 2rem; font-size: 2rem;}
main.company h5 { margin: 0 0 1.5rem; font-size: 1.7rem;}
/* 220802 修正依頼対応
main.company p { margin-bottom: 4rem;}*/
main.company p.lead { font-size: 2rem;}

main .companyCns { background-size: 100% auto;}
main .companyCns .section { padding: 0 4rem 20rem;}
main .companyCns h2 { font-size: 4.6rem;}
main .companyCns h3 { max-width: none;}

main .companyOas { margin: 0 0 -10rem; background-size: auto 100%;}
main .companyHad { background-size: auto 100%;}
main .companyOas .section,
main .companyHad .section { padding-top: 20rem;}
main .companyOas h2,
main .companyHad h2,
main .companyOss03 h3,
main .companyOss04 h3 { margin: 0 0 2rem;}
main .companyOas p {text-align: right;}

main .companyOss01 { margin: 0 0 -10rem; background-size: 45% auto;}
main .companyOss01 h2 { margin-left: auto;font-size: 4rem;}
main .companyOss01 h3 { margin: 4rem 0 1rem auto;}
main .companyOss01 h4 { margin-left: auto;font-size: 3rem;}
main .companyOss01 img { margin: 1rem 0.5rem;}

main .companyOss02 { margin: 0 0 -10rem; background-size: 60% auto;}
main .companyOss02 h3 { margin: 0 0 2rem auto;}
main .companyOss02 h4 { margin-left: auto;}
main .companyOss02 img { margin: 1rem 0.5rem;}

main .companyOss03 { background-size: auto 100%;}
main .companyOss03 .section { padding: 20rem 4rem;}

main .companyOss04 { margin: 0 0 -10rem; background-size: auto 75%;}
main .companyOss04 .section { padding: 10rem 4rem 20rem;}
main .companyOss04 h3,
main .companyOss04 h4,
main .companyOss04 p { max-width: 55%;}

main .companyAwr01 { background-size: 55% auto;}
main .companyAwr01 h2 { margin: 0 0 4rem auto; text-align: right;}
main .companyAwr01 .lead { max-width: 50%;}
main .companyAwr01 h3 { margin: 4rem 0 0 auto;}
main .companyAwr01 .shops { margin: 0 -2rem; width: calc(100% + 4rem);}
main .companyAwr01 .shops > div { margin: 4rem 2rem 0;}
main .companyAwr01 .shops > .logoImg { margin: 4rem 2rem 0;}
main .companyAwr01 .shops > .shopText { width: calc(66% - 3rem);}
main .companyAwr01 .shops > .tripleHalf { width: calc(33.33% - 4rem);}
main .companyAwr01 .storeImg { margin: 0 0 2rem;}
main .companyAwr01 .storeImg img { max-width: 100%;}
main .companyAwr01 .partnerShops dt,
main .companyAwr01 .partnerShops dd { margin: 0 0 2rem;}

main .companyAwr02 { margin: 0 0 -20rem; background-size: auto 100%;}
main .companyAwr03 { background-size: auto 66%;}
main .companyEdu { margin: 0 0 -10rem; background-size: auto 56%;}
main .companyAwr02 .section,
main .companyAwr03 .section { padding: 20rem 4rem;}
main .companyAwr02 h2,
main .companyAwr03 h2,
main .companyEdu h2,
main .companyEdu h4 { margin: 0 0 2rem; font-size: 3rem;}
main .companyAwr02 p,
main .companyAwr03 p { max-width: 66%;}

main .companyFal { background-size: auto;}
main .companyFal .section { padding-bottom: 50%;}
main .companyFal h2 { margin: 0 0 2rem; max-width: 66%; font-size: 3rem;}
main .companyFal p { max-width: 66%;}

main .companyAbt .section { margin: 0 -2rem; width: calc(100% + 4rem);}
main .companyAbt .section div { margin: 4rem 2rem 0;}
main .companyAbt .section .half { width: calc(50% - 4rem);}
main .companyAbt h3 { margin: 0 0 2rem; font-size: 2rem;}
main .companyAbt h4 { margin: 0 0 3rem; font-size: 1.8rem;}
main .companyAbt dt,
main .companyAbt dd { margin: 0 0 2rem;}
main .companyAbt dl ol li { margin: 0 0 1rem; line-height: 1.4;}

main .companyAbt.access h2 { margin: 0; width: calc(100% - 4rem);}
main .companyAbt.access .googleMap { width: calc(100% - 4rem);}

/* membership */
main .membership section:first-of-type { padding-top: 0;}
main .membership h4.left { font-size: 3rem;}
main .membership h4.left + p,
main .membership p { margin: 0 0 4rem;}

.borderBox { margin: 6rem auto 0; padding: 4rem; max-width: 100rem;}
.borderBox h3 { margin: -6.5rem 0 4rem;}
.borderBox ol li { margin: 0 0 2rem;}
.borderBox ol strong { margin: 0 4rem 0 0; padding: 2rem 0 0; width: 10rem; height: 10rem; font-size: 4rem;}
.borderBox ol strong span { margin: 0 0 1rem; font-size: 1.4rem;}
.borderBox ol p { width: calc(100% - 14rem); font-size: 2rem;}

.flexBlock { display: -webkit-box; display: -ms-flexbox; display: flex;}
.gray .flexBlock { margin: 0 auto; max-width: 184rem;}
.flexBlock > div { padding: 0 3rem; width: 50%;}
.flexBlock h3 { font-size: 3.2rem;}
.flexBlock ol li { margin: 0 0 2rem 2rem; font-size: 1.8rem;}

.blockBg { margin: 0 0 6rem; padding: 1rem 2rem;}

.lineBg span { padding: 0 2rem;}
.lineBg ~ .lineBg { margin-top: 8rem;}

.discList { margin: 0 0 4rem;}
.discList li { margin: 0 2rem 2rem; font-size: 1.8rem;}

.aboutList { margin: 0 0 4rem;}
.aboutList li { margin: 0 0 2rem;}

.pagination { padding: 2rem 0 0;}
.pagination .pager,
.pagination .prev,
.pagination .next { margin: 0 0 0 1.5rem; width: 5rem; line-height: 5rem; font-size: 1.8rem;}
.pagination .prev,
.pagination .next { margin: 0 0 0 1.5rem; padding: 0 2rem;}

/* 404 */
main section.notFound { padding: 6rem 4rem 12rem; min-height: 0;}
.notFound figure { margin: 0 auto 6rem; width: min(60%, 100rem);}
.notFound h1 strong { font-size: 6rem;}
.notFound p { margin: 6rem 0 0; font-size: 2.2rem;}

/* wpPage */
.wpPage { padding: 0;}
.wpPage > div { padding: 10rem 4rem;}
.wpPage > p { margin: 0 auto; padding: 10rem 4rem; max-width: 184rem;}
.wpPage p:empty { display: none;}
.wpPage h1,
.wpPage h2,
.wpPage h3,
.wpPage h4,
.wpPage h5,
.wpPage h6 { max-width: 184rem;}
.wpPage h1 { font-size: 4rem;}
.wpPage h2 { font-size: 3.2rem;}
.wpPage h3 { font-size: 2.8rem;}
.wpPage h4 { font-size: 2.4rem;}
.wpPage h5 { font-size: 2rem;}
.wpPage h6 { font-size: 1.6rem;}
.wpPage > h1,
.wpPage > h2,
.wpPage > h3,
.wpPage > h4,
.wpPage > h5,
.wpPage > h6 { padding: 0 4rem;}
.wpPage > h1 + div,
.wpPage > h1 + p,
.wpPage > h2 + div,
.wpPage > h2 + p,
.wpPage > h3 + div,
.wpPage > h3 + p,
.wpPage > h4 + div,
.wpPage > h4 + p,
.wpPage > h5 + div,
.wpPage > h5 + p,
.wpPage > h6 + div,
.wpPage > h6 + p { margin: 0; padding-top: 0 !important;}
.wpPage > div div,
.wpPage > div p { margin: 0 0 4rem;}

.wpPage .mainVisualA,
.wpPage .mainVisualB,
.wpPage .mainVisualC,
.wpPage .mainVisualD { padding: 10rem 0;}
.wpPage .mainVisualB > div,
.wpPage .mainVisualC ul,
.wpPage .mainVisualD > div { margin: 0 auto; padding: 0 4rem; max-width: 184rem;}
.wpPage .mainVisualB > div { padding: 0 1rem;}
.wpPage .mainVisualB > div div { margin: 0 3rem;}
.wpPage .mainVisualC ul { width: 60%;}
.wpPage .mainVisualC li { margin: 0 1rem; max-width: 100%;}
.wpPage .mainVisualC .slick-arrow { left: -30%; margin: -3rem 0 0; width: 6rem; height: 6rem; background-size: 3.6rem;}
.wpPage .mainVisualC .slick-next { left: auto; right: -30%;}
.wpPage .mainVisualC .slick-dots { bottom: -3.5rem;}

.wpPage .textGroupAL,
.wpPage .textGroupAC,
.wpPage .textGroupAR,
.wpPage .textGroupFR,
.wpPage .textGroupFL { padding: 10rem 0;}
.wpPage .textGroupAL h2,
.wpPage .textGroupAL p,
.wpPage .textGroupAC h2,
.wpPage .textGroupAC p,
.wpPage .textGroupAR h2,
.wpPage .textGroupAR p { margin: 0 auto 4rem; padding: 0 4rem; max-width: 184rem;}
.wpPage .textGroupFR > div,
.wpPage .textGroupFL > div { margin: 0 auto; padding: 0 4rem; max-width: 184rem;}
.wpPage .textGroupFR h2 { order: 2; margin: 0 0 0 4rem; min-width: 30%;}
.wpPage .textGroupFL h2 { margin: 0 4rem 0 0; min-width: 30%;}

.wpPage hr { margin: 4rem auto; width: calc(100% - 8rem); max-width: 130rem;}
.wpPage div hr { margin: 4rem auto; width: 100%;}

.wpPage .imgTextGroupFR,
.wpPage .imgTextGroupFL { padding: 10rem 0;}
.wpPage .imgTextGroupFR > div,
.wpPage .imgTextGroupFL > div { margin: 0 auto; padding: 0 4rem; max-width: 184rem;}
.wpPage .imgTextGroupFR div div,
.wpPage .imgTextGroupFL div div { margin: 0; width: 50%;}
.wpPage .imgTextGroupFL div div:first-child { padding-right: 4rem;}
.wpPage .imgTextGroupFR div div:last-child { padding-left: 4rem;}
.wpPage .imgTextGroupFR h3,
.wpPage .imgTextGroupFL h3 { text-align: center;}
.wpPage .imgTextGroupL,
.wpPage .imgTextGroupM,
.wpPage .imgTextGroupS { padding: 10rem 0;}
.wpPage .imgTextGroupL > div,
.wpPage .imgTextGroupM > div,
.wpPage .imgTextGroupS > div { margin: 0 auto; padding: 0 1rem; max-width: 184rem;}
.wpPage .imgTextGroupL > div > div { margin: 0 3rem;}
.wpPage .imgTextGroupM > div > div { display: block; margin: 0 3rem; width: calc(33.33% - 6rem);}
.wpPage .imgTextGroupM .figure { margin: 0 0 4rem; max-width: 100%;}
.wpPage .imgTextGroupS > div > div { margin: 0 3rem; width: calc(25% - 6rem);}
.wpPage .imgTextGroupF { padding: 10rem 0 4rem;}
.wpPage .imgTextGroupF > div { margin: 0 auto; padding: 0 1rem; max-width: calc(184rem * 0.8);}
.wpPage .imgTextGroupF > div > div { margin: 0 3rem 6rem !important; width: calc(25% - 6rem);}

.wpPage .recommendSlide.wpSlide { margin: 0; padding: 10rem 0;}
.wpPage .recommendSlide.wpSlide > div { margin: 0 auto; padding: 0 4rem; max-width: 184rem;}
.wpPage .recommendSlide.wpSlide .slick-slider { width: calc(100% + 4rem);}
.wpPage .recommendSlide .slick-dots { width: calc(100% - 24rem);}

.wpPage .imgTile4 { padding: 10rem 0 6rem;}
.wpPage .imgTile4 > div { margin: 0 auto; padding: 0 2rem; max-width: 184rem;}
.wpPage .imgTile4 > div div { margin: 0 2rem 4rem; width: calc(50% - 4rem);}
.wpPage .imgTile9,
.wpPage .imgTile16 { padding: 10rem 0 8rem;}
.wpPage .imgTile9 > div,
.wpPage .imgTile16 > div { margin: 0 auto; padding: 0 3rem; max-width: 184rem;}
.wpPage .imgTile9 > div div,
.wpPage .imgTile16 > div div { margin: 0 1rem 2rem; width: calc(33.33% - 2rem);}
.wpPage .imgTile16 { margin: 0 auto; max-width: 100%;}
.wpPage .imgTile16 > div div { width: calc(25% - 2rem);}
.wpPage .imgTileL,
.wpPage .imgTileR { padding: 10rem 0;}
.wpPage .imgTileL > div,
.wpPage .imgTileR > div { margin: 0 auto; padding: 0 2rem; max-width: 184rem;}
.wpPage .imgTileL > div > div,
.wpPage .imgTileR > div > div { margin: 0 2rem; width: calc(50% - 4rem);}
.wpPage .imgTileL > div > div:last-child div,
.wpPage .imgTileR > div > div:first-child div { margin: 0 0 4rem;}

.wpPage .btns .btn { margin: 0 2rem 4rem;}

.wpPage .tabChange { margin: 0 auto; padding: 0; max-width: 134rem;}
.wpPage .tabChange li { margin: 0 2rem; padding: 1rem 2rem; width: calc(25% - 4rem);}
.wpPage .tabChange li:hover { background: #CCC;}
.wpPage .tabChange li.select { color: #FFF; background: #333;}
.wpPage .tabs { display: none; margin: 0;}
.wpPage .tabs div { margin: 0; padding: 6rem 0 0;}

.wpPage .menuGroupA,
.wpPage .menuGroupB,
.wpPage .menuGroupC,
.wpPage .menuGroupD,
.wpPage .menuGroupE,
.wpPage .menuGroupF,
.wpPage .menuGroupG { margin: 0 auto; padding: 0 4rem 6rem; max-width: 184rem;}
.wpPage .menuGroupA a ~ p,
.wpPage .menuGroupB a ~ p,
.wpPage .menuGroupC a ~ p,
.wpPage .menuGroupD a ~ p,
.wpPage .menuGroupE a ~ p,
.wpPage .menuGroupF a ~ p,
.wpPage .menuGroupG a ~ p { display: none;}
.wpPage .menuGroupA h4,
.wpPage .menuGroupB h4,
.wpPage .menuGroupC h4,
.wpPage .menuGroupD h4,
.wpPage .menuGroupE h4,
.wpPage .menuGroupF h4,
.wpPage .menuGroupG h4 { padding: 0 0 1rem;}
.wpPage .menuGroupA ul,
.wpPage .menuGroupB ul,
.wpPage .menuGroupD ul { margin: 0 -2rem;}
.wpPage .menuGroupA li,
.wpPage .menuGroupD li,
.wpPage .menuGroupE > div,
.wpPage .menuGroupF > div,
.wpPage .menuGroupG > div { margin: 0 2rem 4rem; width: calc(50% - 4rem);}
.wpPage .menuGroupA a,
.wpPage .menuGroupB a,
.wpPage .menuGroupC a,
.wpPage .menuGroupD a,
.wpPage .menuGroupE a,
.wpPage .menuGroupF a,
.wpPage .menuGroupG a { text-decoration: none;}
.wpPage .menuGroupA li > div,
.wpPage .menuGroupA a > div,
.wpPage .menuGroupC li > div,
.wpPage .menuGroupC a > div { margin: 0 2rem 0 0; width: 20%;}
.wpPage .menuGroupA li > div,
.wpPage .menuGroupA .enlargeImg,
.wpPage .menuGroupB li > div,
.wpPage .menuGroupB .enlargeImg,
.wpPage .menuGroupC li > div,
.wpPage .menuGroupC .enlargeImg,
.wpPage .menuGroupD li > div,
.wpPage .menuGroupD .enlargeImg,
.wpPage .menuGroupE li > div,
.wpPage .menuGroupE .enlargeImg,
.wpPage .menuGroupF li > div,
.wpPage .menuGroupF .enlargeImg,
.wpPage .menuGroupG li > div,
.wpPage .menuGroupG .enlargeImg { border-radius: 99rem; overflow: hidden;}
.wpPage .menuGroupA p { width: calc(80% - 4rem); font-size: 1.6rem;}
.wpPage .menuGroupB li { margin: 0 2rem 4rem; width: calc(33.3% - 4rem);}
.wpPage .menuGroupD li { width: calc(20% - 4rem);}
.wpPage .menuGroupB li > div { margin: 0 2rem 0 0; width: 31%;}
.wpPage .menuGroupB a > div { margin: 0 2rem 0 0; width: 39%;}
.wpPage .menuGroupB p { width: calc(69% - 2rem); font-size: 1.6rem;}
.wpPage .menuGroupC ul { margin: 0 -2rem; max-width: none;}
.wpPage .menuGroupC li { margin: 0 2rem 4rem; width: calc(25% - 4rem);}
.wpPage .menuGroupC li > div,
.wpPage .menuGroupC a > div,
.wpPage .menuGroupD a > div,
.wpPage .menuGroupD li > div { margin: 0 2rem 0 0; width: 35%;}
.wpPage .menuGroupC p,
.wpPage .menuGroupD p { width: calc(65% - 2rem); font-size: 1.6rem;}
.wpPage .menuGroupD li:nth-child(5n) { margin-right: 2rem;}
.wpPage .menuGroupE { max-width: calc(184rem * 0.8);}
.wpPage .menuGroupE,
.wpPage .menuGroupF,
.wpPage .menuGroupG { padding: 0 1rem 10rem;}
.wpPage .menuGroupE > div,
.wpPage .menuGroupF > div,
.wpPage .menuGroupG > div { margin: 0 3rem;}
.wpPage .menuGroupE ul,
.wpPage .menuGroupG ul { margin: 0 0 -4rem;}
.wpPage .menuGroupE li,
.wpPage .menuGroupG li { margin: 0 0 4rem;}
.wpPage .menuGroupF ul { margin: 0 -2rem -4rem;}
.wpPage .menuGroupF li { margin: 0 2rem 4rem; width: calc(50% - 4rem);}
.wpPage .menuGroupE li > div,
.wpPage .menuGroupE a > div { margin: 0 2rem 0 0; width: 20%;}
.wpPage .menuGroupE p { width: calc(80% - 2rem); font-size: 1.6rem;}
.wpPage .menuGroupF li > div,
.wpPage .menuGroupF a > div { margin: 0 2rem 0 0; width: 34%;}
.wpPage .menuGroupF p { width: calc(66% - 2rem); font-size: 1.6rem;}
.wpPage .menuGroupG > div { width: calc(33.33% - 2rem);}
.wpPage .menuGroupG li > div,
.wpPage .menuGroupG a > div { margin: 0 2rem 0 0; width: 30%;}
.wpPage .menuGroupG p { width: calc(70% - 2rem); font-size: 1.6rem;}

.wpPage .listGroup1,
.wpPage .listGroup2,
.wpPage .listGroup3 { margin: 0 auto; padding: 0 0 8rem; max-width: 130rem;}
.wpPage .listGroup1 h4,
.wpPage .listGroup2 h4,
.wpPage .listGroup3 h4 { padding: 0 0 1rem;}
.wpPage .listGroup1 li,
.wpPage .listGroup2 li,
.wpPage .listGroup3 li { margin: 0 0 2rem 2rem;}
.wpPage .listGroup2 > div,
.wpPage .listGroup3 > div { margin: 0 -3rem;}
.wpPage .listGroup2 ul,
.wpPage .listGroup3 ul { margin: 0 0 -2rem;}
.wpPage .listGroup2 > div div,
.wpPage .listGroup3 > div div { margin: 0 3rem; width: calc(50% - 6rem);}

.wpPage .registerWrap { padding-top: 0;}
.wpPage .registerWrap .beforeTable { margin: 0 0 2rem;}
.wpPage .registerWrap th,
.wpPage .registerWrap td { padding: 2rem; border-bottom: 1px solid #333;}
.wpPage .registerWrap td .note { margin: 1rem 0 0;}
.wpPage .registerWrap td .note.inlineBlock { display: inline-block; margin: 0; vertical-align: middle;}
.wpPage .registerWrap .submit { margin: 2rem 0 0;}
.wpPage .registerWrap .submit .inputWrap { margin: 2rem 2rem 0;}

.questionnaire { margin: 6rem 0 4rem; padding: 6rem;}
.questionnaire h3 { margin: 0 0 3rem;}
.questionnaire dt { padding: 2rem 0;}
.questionnaire dd { padding: 0 0 2rem;}

/* connect */
.connect main section:first-of-type { padding-top: 6rem;}
.connect main section:first-of-type:has(.cLogo) { padding-top: 0;}
.connect .modalBlock { padding: 6rem; width: 70vw;}
.connect .modalBlock p { margin: 0 0 4rem;}

#connectHead { top: 11rem; padding: 2rem 3rem;}
#connectHead .connectTitle { font-size: 3rem;}
#connectHead .faqLink { font-size: 1.8rem;}
#connectHead .mypageLink { max-width: calc(100vw - 72rem); font-size: 1.8rem;}
#connectHead .btn,
#connectHead .mypageLink { margin-left: 4rem;}
#connectHead img { margin: 0 .8rem 0 0; width: 2.8rem;}
#connectHead .btn img { margin: 0 .5rem 0 0;}
#connectHead .btn { padding: 1.2rem 2rem 1rem; font-size: 1.6rem;}
#connectHead .logout { padding: 1.2rem 2rem 1rem; font-size: 1.6rem;}
#connectHead .logout img { margin: 0 .5rem 0 0;}

.connectTitle { font-size: 5.2rem;}
.connectTitle small { font-size: 2.4rem;}
.connectTitle + .center { font-size: 2rem; line-height: 1.8;}
.connectTitle + .center strong { margin: 2rem auto 0; font-size: 2.6rem;}
.connectTitle .cLogo { width: 33.6rem;}

.connectTitle ~ .flexList.whiteTitle { margin-top: 6rem;}
.connectTitle ~ .flexList.whiteTitle figcaption { font-size: 2.2rem;}

#connectCat { margin: 6rem 0 4rem;}
#connectCat li { flex-grow: 2;}
#connectCat li:has(.narrowing) { flex-grow: 1; display: block; text-align: right;}
#connectCat li a { font-size: 2rem;}
#connectCat li .connectCat { padding: 2.5rem 2rem 1.9rem;}
#connectCat li .connectCat img { margin: 0 0 0 1rem; width: 2rem;}
#connectCat li .narrowing { display: inline-block; margin: 0 0 0 auto; padding: 1.9rem 3rem 1.5rem; border-radius: 5rem;}
#connectCat li .narrowing::after { border-radius: 5rem;}
#connectCat li .narrowing img { position: relative; top: -0.2rem; margin: 0 1rem 0 0; width: 3rem; vertical-align: middle;}

.connectCatDiv ul { margin: 0 -1rem; width: calc(100% + 2rem);}
.connectCatDiv li { margin: 0 1rem 2rem; width: calc(20% - 2rem);}
.connectCatDiv li a { padding: 1rem 0 0.7rem; font-size: min(1.8rem, 1.2vw);}

#connectAreaDiv { top: -6rem; right: auto; max-height: 60rem;}
#connectAreaDiv.active { top: -4rem;}
#connectAreaDiv a { padding: 1.5rem 1.5rem 1.1rem;}

.connectNarrowDiv h2 small { font-size: 2.8rem;}
.connectNarrowDiv h3 { margin: 0 0 3rem; padding: 1.5rem 2rem 1.1rem; font-size: 2rem;}
.connectNarrowDiv .narrowChecks { margin: 0 1rem 3rem; width: 100%;}
.connectNarrowDiv .narrowChecks label { margin: 0 1rem 2rem; min-width: calc(25% - 2rem); }
.connectNarrowDiv .narrowPrice { margin: 0 0 5rem;}
.connectNarrowDiv .narrowPrice input { margin: 0 1rem 0 0; width: 20rem;}
.connectNarrowDiv .narrowArea select { width: 100%;}
.connectNarrowDiv p.center { margin: 5rem 0 0;}
.connectNarrowDiv .btn small { font-size: 1.8rem;}

.connect .pager { font-size: 1.8rem;}

.clMemList { margin: 0 0 4rem; padding: 0 0 4rem;}
.clMemList:last-of-type { margin: 0 0 2rem;}
.clMemList h4 { margin: 0 0 2rem; font-size: 2.6rem;}
.clMemList h5 { margin: 0 0 1.5rem; font-size: 2rem;}
.clMemBlock { display: block; margin: 0 4rem 0 0; width: 26rem; text-align: center;}
.clMemBlock .cdProf { margin: 0 auto 2rem; min-width: 22rem; height: 22rem;}
.clMemName { text-align: center;}
.clMemDetail { margin: 0 4rem 0 0; width: calc(55% - 17rem);}
.clMemText { font-size: 1.8rem; -webkit-line-clamp: 11;}
.clMemPrices { margin: 2rem 0 0; font-size: 2.2rem;}
.clTags { width: calc(45% - 17rem);}
.clMemPrice { font-size: 1.8rem;}
.connect .flexList figcaption { font-size: 1.8rem; line-height: 1.4;}
.connect .flexList .ctProf { margin: 0; padding: 0 2rem 2rem;}
.connect .flexList .ctProf .cdProf { margin: 0 2rem 0 0; width: min(8rem, 4vw); min-width: min(8rem, 4vw); height: min(8rem, 4vw);}
.connect .flexList .ctProf p { font-size: 1.6rem;}


#connectSpecial .rightBtn { margin-top: -7.5rem; font-size: 2rem;}
#connectSpecial .rightBtn img { margin: 0 0 0 0.8rem; width: 1.8rem;}
#connectSpecialList { margin: -4rem -2rem -5rem; width: calc(100% + 4rem);}
#connectSpecialList li { margin: 4rem 2rem 0; width: calc(50% - 4rem);}

#fixBtns .btn.narrowing {
    bottom: -4rem;
    padding: 6.2rem 0 0 !important;
    font-size: 1.7rem !important;
    background-position: center 1.6rem;
    background-size: 4.2rem;
    opacity: 0;
    pointer-events: none;
}
#fixBtns .btn.narrowing.active { bottom: 0; opacity: 1; pointer-events: auto;}

figure:has(img.zooming)::after { width: 5rem; height: 5rem; background-size: 3.2rem;}
figure:has(img.zooming):has(ul)::after { display: none;}

main section.cdTopSection,
main section.cdTopSection ~ #connectOthers { max-width: 144rem;}

#cdSlides { margin: 0 0 6rem;}
#cdSlide { margin: 0 0 3rem;}
#cdSlide figure { display: inline-block;}
#cdSlide img { max-height: 60rem;}
#cdSlides p { margin: 2rem 0 0; font-size: 2.2rem;}

h2.cdSubtitle { margin: -3rem 0 4rem; font-size: 3rem !important;}
.cdTitle ~ p { margin: 0 0 4rem; font-size: 2rem;}

.cdLinks { display: flex; align-items: center; margin: 8rem 0 0; }
.cdTopSection .cdLinks { margin-bottom: -10rem;}
.cdLinks .cdProf { margin: 0 4rem 0 auto;}
.cdLinks h2 { margin: 0 0 3rem !important; font-size: 3rem; text-align: left;}
.cdLinks .center { text-align: left !important;}
.cdLinks .btn { margin: 0;}
.cdLinks .btn ~ .btn { margin: 0 0 0 3rem;}
.cdLinks .btn img { margin: 0 1rem 0 0; width: 2.8rem;}
.cdNames { margin: 0 auto 0 0;}

.cdProf { margin: 0 auto 3rem;}

#connectOthers .flexList { margin: 0 -2rem -4rem;}

.cdShop { display: flex; align-items: center; justify-content: flex-start; margin: 0 0 8rem; text-align: left;}
.cdShop .cdProf { margin: 0 4rem 0 0; width: 30rem; min-width: 30rem; height: 30rem;}
.cdShop strong { font-size: 4rem;}
.cdShop .cdNames { text-align: left;}
.cdShop .cdCategory { justify-content: start; margin: 3rem -1rem 0;}
.cdShop .cdCategory li { margin: 0 1rem 2rem; font-size: 1.8rem;}
.cdShop .btn { margin: 1rem 0 0;}
.cdShop .btn img { margin: 0 1rem 0 0; width: 2.8rem;}
.cdShop ~ p { margin: 0 0 8rem; font-size: 2rem;}

main section.cdTopSection.cdProfile { padding-bottom: 6rem;}
main section.cdTopSection h2.left { margin: 0 0 4rem; font-size: 3rem;}

.cdCategory { margin: 0 -1rem 6rem; width: calc(100% + 2rem);}
.cdCategory li { margin: 0 1rem 2rem; padding: .9rem 2rem .5rem;}

.iconsLinks a ~ a { margin: 2.5rem 0 0;}
.iconsLinks img { top: -0.2rem; width: 3.4rem;}

main section.connectForm { max-width: 144rem;}

.cfTitle { font-size: 3rem;}
.cfTitle .cdProf {  margin: 0 3rem 0 0; width: 15rem; min-width: 15rem; height: 15rem;}

.cfMemo { display: flex; margin: 4rem 0; padding: 4rem;}
.cfMemo h2 { margin: 0 0 2rem !important; font-size: 2.2rem;}
.cfMemo div { padding: 0 4rem 0 0; width: 65%;}
.cfMemo .bordered { margin: 0; padding: 0 0 0 4rem; width: 35%; border-top: none; border-left: 1px dashed #749FC3;}
.cfMemo p { margin: 2rem 0; line-height: 1.6;}

.connectForm dl { display: flex; flex-wrap: wrap; margin: 0 0 6rem; padding: 4rem 0;}
.connectForm dt { margin: 0 3rem 4rem 0; width: 28rem; font-size: 2rem; line-height: 4rem;}
.connectForm dd { margin: 0 0 4rem; width: calc(100% - 31rem);}
.connectForm dd.noInput { align-self: center;}
.connectForm dt:last-of-type,
.connectForm dd:last-of-type { margin-bottom: 0;;}
.connectForm dt::after,
.connectFormMini dt::after { display: block; position: absolute; top: calc(50% - 1.4rem); padding: .5rem 1rem .3rem ; line-height: 1.3; font-size: 1.4rem;}
.connectForm.doc dt::after { top: .5rem;}
.connectForm.doc dt { width: 27rem; }
.connectForm.doc dd {  width: calc(100% - 30rem);}

.upImg .btn { margin: 2rem 0 0;}
.upImg { padding: 13rem 4rem 5rem;}
.upImg::after { top: 4rem;}
.upImg .kome { margin: 3rem 0 0;}
.fileName { margin: 3rem 3rem 0 0;}
.fileName:last-of-type { margin-right: 0 !important;}
.fileName .imgSum { margin: 0 0 2rem; width: min(18rem, calc((100vw - 39rem)*0.2 - 3rem)); height: min(18rem, calc((100vw - 39rem)*0.2 - 3rem));}

.connectForm dt::after,
.privacyCheck label::after,
.connectFormMini dt::after { top: .7rem;}
.connectForm .addDetail { display: flex; flex-wrap: wrap; align-items: center; margin: -1.5rem 0 3rem;}
.connectForm .addDetail span { margin: 1.5rem 0; width: calc(100% - 20rem);}
.connectForm .addDetail span.type { width: 20rem;}
.connectForm dd.password { text-align: left;}
.connectForm dd.password input[type=password] { width: 50%;}
.connectForm dd.password label { margin: 0 0 0 3rem;}
.connectForm .cfPrice input,
.connectForm .cfDate input { margin: 0 1rem 0 0;}
.connectForm .cfDate input ~ input { margin: 0 1rem;}
.connectForm dd.choise { margin: 0 -4rem 2rem 0; padding-top: 1rem; width: calc(100% - 27rem);}
.connectForm dd.choise:last-of-type { margin-bottom: -2rem;}
.connectForm dd.choise label { margin: 0 4rem 0 0;}
.connectForm dd.choise h2 { margin: 0 0 2rem; font-size: 2rem;}
.connectForm dd.choise h2 ~ h2 { margin: 2rem 0 2rem;}
.connectForm dd.choise label { margin: 0 4rem 2rem 0; min-width: calc(20% - 4.5rem);}
.connectForm dd.choise .long label { min-width: calc(33.33% - 4.5rem);}
.connectForm dd.choise label.thin { letter-spacing: -2px;}
.connectForm dd.choise .attention { width: calc(100% - 4rem);}
.cautionTip { right: auto; left: 0;}
.cautionDiv { margin: 4rem 0; padding: 3rem 3rem 3rem 8rem; background-position: 3rem center;}
.attention { margin: 2rem 0 0; padding-top: 2.4rem;}

.attention.news { margin: 0 0 4rem; padding: 6rem;}
.attention.news h3 { margin: 0 0 3rem; font-size: 3rem; text-align: left;}
.attention.news h3 img { top: -0.3rem; margin: 0 0.5rem 0 0; width: 3.8rem;}
.attention.news p { line-height: 1.6;}

.privacyText { margin: 0 0 6rem; padding: 6rem;}
.privacyText ~ .privacyText { margin-top: 6rem;}
.privacyText h3 { margin: 0 0 3rem; font-size: 2.4rem;}
.privacyText h4 { margin: 0 0 2rem; font-size: 2rem;}
.privacyText h5 { margin: 0 0 2rem;}
.privacyText p,
.privacyText li { margin: 0 0 4rem;}
.privacyText li ol { margin: -2rem 0 4rem;}
.privacyText li li { margin: 0 0 2rem 2rem;}
.privacyCheck { font-size: 2rem;}
.privacyCheck label::after { top: -.5rem; margin: 0 0 0 2rem;}

.privacyText.news h3 { font-size: 3.2rem;}
.privacyText.news h4 { font-size: 2.6rem;}
.privacyText.news h4 ~ h4 { margin-top: 6rem;}
.privacyText.news h5 { margin: 0 0 1.5rem 2rem; font-size: 2.2rem;}
.privacyText.news p { margin: 0 0 3rem 2rem;}

.connectForm .btns { margin: 6rem 0 0;}
.connectForm .btns .btn ~ .btn { margin: 0 0 0 6rem;}
.connectForm .btns .btn.darkred img { width: 2.6rem;}

.connectForm .btns ~ .btns { margin: 6rem 0 0; padding: 6rem 0 0;}

.connectForm.conf dl { padding: 3rem 0 0;}
.connectForm.conf dt,
.connectForm.conf dd { margin: 0 0 3rem !important; padding-left: 3rem; padding-bottom: 3rem; min-height: 6rem; line-height: 1.6; border-bottom: 1px solid #9fb1c3;}
.connectForm.conf dt { margin-right: 0; padding: 0 3rem 3rem 0; width: 31rem; line-height: 1.4;}
.connectForm.conf dt::after { top: .1rem;}
.connectForm.conf dt:last-of-type,
.connectForm.conf dd:not(.choise):last-of-type { margin-bottom: 0 !important; border: none;}
.connectForm.conf dd.choise { margin: 0 -4rem 3rem 0 !important; padding-top: .5rem;}
.connectForm.conf dd.choise h2 ~ h2 { margin: 3rem 0 2rem;}
.connectForm.conf .fileName { margin: 0 2rem 0 0;}

.connectForm.comp { min-height: 0;}
.compText { margin: 4rem 0 10rem !important;}

.connectFormMini { display: flex; flex-wrap: wrap; align-items: center;}
.connectFormMini dt { margin: 0 0 3rem; width: 21rem;}
.connectFormMini dt::after { top: -.5rem; right: 2rem;}
.connectFormMini dd { margin: 0 0 3rem; width: calc(100% - 21rem);}
.connectFormMini.long dt { width: 26rem;}
.connectFormMini.long dd { width: calc(100% - 26rem);}

#connectLogin { display: flex;}
#connectLogin p { margin: 2rem 0 0; line-height: 1.4;}
#connectLogin .membered,
#connectLogin .notMembered { margin: 0; width: 50%; max-width: none;}
#connectLogin .membered { margin: 0 7% 0 0; width: 43%;}
#connectLogin .notMembered h2 { margin: 0 0 3rem; font-size: 3rem;}
#connectLogin .membered .center ~ .center { margin: 6rem 0 0;}
#connectLogin .notMembered { padding: 6rem;}
#connectLogin .notMembered h3 { margin: 4.5rem 0 3rem; padding: 4rem 0 0; font-size: 2.4rem;}
#connectLogin .notMembered p { line-height: 1.6; text-align: center;}
#connectLogin .notMembered .center { margin: 4rem 0 0;}
#connectLogin .notMembered .br { display: inline-block;}

#connectRemind { max-width: 85rem; min-height: 0;}
#connectRemind p { line-height: 1.6; text-align: center;}
#connectRemind .bordered { margin: 6rem 0 0; padding: 6.5rem 0 0;}
#connectRemind .btn ~ .btn { margin-left: 6rem;}

.connectMypage { overflow: visible;}

.cmTop { align-items: center; flex-wrap: nowrap; margin: 0 0 4rem;}
.cmTop .cfTitle { margin: 0 auto 0 0; width:auto; max-width: calc(100% - 80rem);}
.cmTop .btns { order: 0; margin: 0; padding: 0; min-width: 0; overflow: visible; white-space: normal;}
.cmTop .btn { margin: 1rem 0; min-width: 0;}
.cmTop .btn ~ .btn { margin-left: 2rem;}
.cmTop .btn img { top: -0.1rem; margin: 0 0.8rem 0 0; width: 3rem;}

.cmTop.short { margin: 0 0 4rem;}
.cmTop.short .cfTitle { margin: 2rem 0 0;}

.connect .connectMypage .paging { margin: 0; padding: 0; border: none;}
.connect .connectMypage .paged,
.connect .connectMypage .select { order: 0; margin: 0 0 2rem; width: 20%;}
.connect .connectMypage .select { text-align: right;}
.connect .connectMypage .pager { width: 60%;}

.connect .connectMypage .paging.down { margin: 0;}
.connect .connectMypage .paging.down .paged,
.connect .connectMypage .paging.down .select { margin: 2rem 0 0;}
.connect .connectMypage .paging.down .pager { order: 0; margin: 0; padding: 2rem 0 0;}

.connectMypage .scroll { margin: 0; padding: 0; overflow: visible;}

#cmList thead { position: -webkit-sticky; position: sticky; top: 20rem; background: #FFF; z-index: 90;}
#cmList th,
#cmList td { padding: 2rem 1rem; font-size: 1.8rem;}
#cmList th { width: 60%;}
#cmList thead th { padding: 2rem 1rem}
#cmList thead th ~ td { padding: 2rem 1rem 2rem 4rem;}
#cmList td:first-child { padding-left: 2rem;}
#cmList td:last-child { white-space: nowrap;}
#cmList thead th div { font-size: 1.8rem;}
#cmList .sort { margin: 0 0 0 1.5rem;}
#cmList .sort ~.sort { margin: 0 0 0 .5rem;}
#cmList .sort img { width: 1.3rem;}

#cmList .cmTitles .btn.gray { margin: 0 4rem 0 0; width: 16rem;}
#cmList .cmTitles figure { margin: 0 3rem 0 0; width: 17rem; min-width: 17rem;}

#cmNews { margin: 4rem 0; padding: 4rem;}
#cmNews h2 { margin: 0 0 2rem !important; font-size: 3.4rem;}
#cmNews .cmNewsLink { display: flex; padding: 1.5rem;}
#cmNews .cmNewsLink span { margin: 0 2rem 0 0; font-size: 1.6rem; line-height: 1.6;}
#cmNews .cmNewsDetail h2 { margin: 0 0 2rem; font-size: 3rem;}
#cmNews .cmNewsDetail p { font-size: 2rem; }
#cmNews .cmNewsDetail p.cmUrl { margin: 2rem 0 4rem;}
#cmNews .cmNewsDetail p.cmUrl img { margin: 0 1.5rem 0 0; width: 2.4rem;}
#cmNews .center { margin: 2rem 0 0;}

#cmNews .cmName { margin: 2rem 0 0;}
#cmNews .cmNewsDetail .cmName { margin: 3rem 0 0;}
#cmNews .cmName .cdProf { margin: 0 2rem 0 0; width: 8rem; height: 8rem; min-width: 8rem; min-height: 8rem;}
#cmNews .cmName .cdNames a:not(.btn) { margin: 0 2rem 0 0;}
#cmNews .cmName .btn { min-width: 21rem;}
#cmNews .cmName .btn.small img { margin: 0 1rem 0 0; width: 2.2rem;}

.connect .cmNewsDetail .modalBlock { top: 50%; width: 50vw; transform: translate(-50%, -50%);}

#cmNews.all { margin: 0; padding: 0; background: none;}
#cmNews.all #cmNewsList a { padding: 3rem 2rem;}
#cmNews.all .cmNewsLink span { margin: 0 3rem 0 0; font-size: 2rem;}
#cmNews.all .cmNewsLink strong { margin: 0 0 1rem; font-size: 2.2rem; line-height: 1.4;}

#cmNews .paging { margin: 3rem 0 0; border: none;}
#cmNews .paging .paged,
#cmNews .paging .select { order: 0; margin: 0;}
#cmNews .paging .pager { margin: 0 auto; padding: 0; width: auto;}
}

@media screen and (min-width:1024px){

/* header */
#headNav { right: 12rem;}
#headNav li { display: inline-block; margin: 0 0 0 4rem;}
#headNav li.pc { display: none !important;}
#headNav li a { font-size: 1.4rem;}
#headNav li strong { font-size: 2rem;}

header { height: 11rem; }

#logo { padding: 3rem; height: 11rem; text-align: left;}
#logo a { font-size: 1.6rem; text-align: center;}
#logo span { margin: 0 0 0.5rem; height: 5rem;}
#logo img { height: 5rem !important;}

#headNav { top: 43%; right: 11rem; margin: -2rem 0 0;}
#headNav li { margin: 0 0 0 3rem; padding: 0.7rem 0 3rem;}
#headNav li.pc { display: inline-block !important;}
#headNav li.pc,
/*#headNav .mypage { margin-top: 0.3rem;}*/
#headNav li a { color: #000 !important; font-size: 1.2rem; text-align: center; text-decoration: none;}
#headNav li a:hover { opacity: .6;}
#headNav a .notice { top: -1.5rem;right: -1.5rem;width: 2rem;height: 2rem; font-size: 1.2rem;line-height: 2rem;}
#headNav li strong { display: block; margin: 0 0 1.4rem; font-size: 1.7rem; letter-spacing: 0.1rem;}
#headNav .mypage.before { padding: 0.7rem 0 3rem;}
#headNav .mypage a { padding: 0; width: auto; height: auto; font-size: 1.2rem; background: none; transform: none;}
#headNav .mypage a strong { display: block;}

#headNav > ul > li.search,
#headNav > ul > li.language { margin-top: -0.6rem; }
#headNav #searchBtn,
#headNav #langBtn { top: -0.3rem; width: 3rem; height: 4.4rem; background-position: top center;}
#headNav #searchBtn:hover,
#headNav #langBtn:hover { cursor : pointer !important;}
#headNav #searchBtn span,
#headNav #langBtn span { display: block; padding: 3.4rem 0 0; font-size: 1.3rem; text-align: center;}
#headNav #searchBtn.active ~form .searchBox { height: 12rem;}

#headNav .searchBox { top: 100%; right: -11rem;}
#headNav .searchBox p { margin: 4rem; border: 1px solid #333;}
#headNav .searchBox p button { width: 4rem; background-image: url("/images/common/icon-searchB.svg"); background-size: 2.8rem;}
#headNav .searchBox:hover,
#headNav .searchBox:focus { border-color: #013161 !important; box-shadow: 0 0.2rem 1rem rgba(1, 49, 97, 0.2) !important;}
#headNav .pc.catSub:hover { cursor : pointer !important;}	

#headNav #langBtn { width: 4rem; background-size: 3rem auto;}
#headNav #langBtn.active ~form .searchBox { height: 12rem;}
#headNav .langMenu { top: 100%; right: -6rem; width: 16rem;}
#headNav .langMenu li { padding: 0;}
#headNav .langMenu a { line-height: 6rem; font-size: 1.6rem;}
#headNav #langBtn.active ~ .langMenu { height: 18rem;}

#headNav li.loginSub .submenu { top: 86%; left: -10rem; width: 40rem;}
#headNav li.loginSub .submenu a { padding: 2rem; font-size: 2rem;}
#headNav li.loginSub .submenu img { top: -0.2rem; width: 3rem;}
#headNav li.loginSub:hover .submenu { height: 16rem;}

#menuTrigger { top: 3rem;left: auto; right: 3rem; padding: 4rem 0 0; width: 5rem;}
#menuTrigger a { font-size: 1.4rem;}
#menuTrigger:before,
#menuTrigger:after,
#menuTrigger a:before { height: 0.3rem;}
#menuTrigger:after { top: 1.4rem; }
#menuTrigger a:before { top: 2.8rem; }
#menuTrigger span { letter-spacing: 0.2rem;}
#menuTrigger.active span.close { letter-spacing: 0;}

#menuTrigger.active:before { background: #FFF; -webkit-transform: translate(0, 1.3rem) rotate(225deg); transform: translate(0, 1.3rem) rotate(225deg); }
#menuTrigger.active:after { background: #FFF; opacity: 0; }
#menuTrigger.active a:before { background: #FFF; -webkit-transform: translate(0, -1.5rem) rotate(-225deg); transform: translate(0, -1.5rem) rotate(-225deg); }

#spNav { top: 11rem;}
#spNav .searchBox p { margin: 3rem;}
#spNav ul { margin: 0 3rem 6rem; border-bottom: 1px solid #FFF;}
#spNav li { width: 33.33%;}
#spNav li:first-child:nth-last-child(2),
#spNav li:first-child:nth-last-child(3),
#spNav li:nth-child(2):nth-last-child(2),
#spNav li:nth-child(2):last-child,
#spNav li:nth-child(3):last-child,
#spNav li:nth-child(3) ~ li:nth-last-child(3),
#spNav li:nth-child(3) ~ li:nth-last-child(2),
#spNav li:nth-child(3) ~ li:last-child { border: none !important;}
#spNav li a { padding: 3.3rem 3rem 3rem;}
#spNav li.sub,
#spNav li.sub:nth-last-child(3) { margin: 2rem 0;}
#spNav .snsLinks { padding: 0 0 3rem;}

#spNav .spNavTitle { margin: 3rem 3rem 2rem;}
#spNav .spNavTitle:first-of-type { margin-top: 6rem;}

.open #headNav li a { color: #FFF !important;}
.open #headNav .list a { background-image: url("/images/common/icon-fileW.svg");}
.open #headNav .mypage a { background: none;}
.open #headNav .mypage img { -webkit-filter: invert(1); filter: invert(1);}
.open #headNav .langMenu { right: -6rem;}
.open #headNav .langMenu a { color: #000 !important;}
.open #headNav .search { margin: 0;}
.open #spNav { height: calc(100vh - 11rem);}

}

@media screen and (min-width:1300px){

/* base */
#headNav li { margin: 0 0 0 4rem;}
#headNav li strong { font-size: 2rem;}
#headNav .submenu li { padding: 2rem;}
#footNav .acd-content li { width: calc(33.33% - 4rem);}

/* common */
main section:last-child { padding-bottom: 10rem;}

.recommendSlide:after { content: ""; display: block; position: absolute; top: 0; right: -4rem; width: 4rem; height: 100%; background: #FFF;}

/* page */
#registAlart { display: flex; align-items: center; top: 20rem; padding: 6rem;}
#registAlart figure { margin: 0 8rem 0 0; width: 30rem;}
#registAlart p { margin: 0 0 4rem; font-size: 1.8rem;}
#registAlart .links { margin: 0;}

#MainVisual li { height: calc(80vh - 11rem);}

#MainVisual li.slide01 .contents.right { top: 35%; right: 34%; width: auto;}
#MainVisual li.slide01 .contents.right h2,
#MainVisual li.slide01 .contents.right p { text-align: left !important;}

.scrollLink { bottom: 3rem;}

#catMain #categoryList .categoryL li { width:  calc(33.33% - 4rem);}

.itemList li .enlargeImg { height: 30rem;}

main .companyCns { background-size: auto 100%;}

main .companyOas { margin: 0 0 -30rem;}
main .companyHad { background-size: auto 100%;}
main .companyOas .section { padding-bottom: 30rem;}
main .companyHad .section { padding-bottom: 20rem;}
main .companyOas h2,
main .companyOas h3,
main .companyOas p { margin-left: auto; max-width: 40%; text-align: left;}

main .companyOss01 { margin: 0 0 -9rem; background-size: auto 100%;}
main .companyOss01 h2 { margin-left: auto;font-size: 4rem;}
main .companyOss01 h3 { margin: 4rem 0 1rem auto;}
main .companyOss01 h4 { margin-left: auto;font-size: 3rem;}
main .companyOss01 img { margin: 1rem 0.5rem;}

main .companyOss02 { margin: 0 0 -30rem; background-size: auto 100%;}
main .companyOss02 h3 { margin: 0 0 2rem auto;}
main .companyOss02 h4 { margin-left: auto;}
main .companyOss02 img { margin: 1rem 0.5rem;}

main .companyOss03 { background-size: auto 100%;}
main .companyOss03 .section { padding: 40rem 4rem 20rem;}

main .companyOss04 { margin: 0 0 -25rem; background-size: auto 75%;}
main .companyOss04 .section { padding: 10rem 4rem 35rem;}
main .companyOss04 h3,
main .companyOss04 h4,
main .companyOss04 p { max-width: 55%;}

main .companyAwr01 { background-size: 50% auto;}
main .companyAwr01 .section { padding-top: 20rem;}
main .companyAwr01 .section > p { text-align: right;}
main .companyAwr01 h2 { margin: 0 0 4rem auto; text-align: right;}

main .companyAwr02 { margin: 0 0 -39rem; background-size: auto 100%;}
main .companyAwr03 { background-size: auto 68.5%;}
main .companyEdu { margin: 0 0 -5rem; background-size: auto;}
main .companyAwr02 .section { padding: 20rem 4rem 40rem;}
main .companyAwr03 .section { padding: 20rem 4rem 35rem;}

main .companyFal { background-size: auto 100%;}
main .companyFal .section { padding: 20rem 4rem 15%;}
main .companyFal h2,
main .companyFal p { margin-left: auto; max-width: 55%;}

main .companyAbt .section { margin: 0 auto;}
}


/* 個別に修正依頼のあった箇所の記述 */

/*.center { text-align: center !important; padding: 0 !important; margin: 0 !important; }*/

body > main > div.wpPage > h3 > p {
    font-size: 2.0rem !important;
    font-weight: 500;
    line-height: 1.6 !important;
}
.textGroupAL__inner,
.textGroupAC__inner,
.textGroupAR__inner,
.text__inner { 
    margin: 0 auto !important;
    padding: 0 4rem;
    max-width: 184rem;
    line-height: 1.6;
 }


 h2.addContents {
    margin-top: 3rem;
    margin-bottom: -4rem;
    padding: 1rem 0 0;
    font-weight: 600;
    color: #013161;
    max-width: 184rem;
 }

 /*親要素*/
.imgTextGroupL2,
.imgTextGroupM2,
.imgTextGroupS2,
.imgTextGroupF2,
.imgTextGroupTR,
.imgTextGroupCM {
     display: flex;
     align-items: stretch;
     flex-wrap: wrap; 
     box-sizing: border-box;
     max-width: 184rem;
     margin: 0 auto !important;
     padding: 0 1rem !important;
  }
.imgTextGroupM2-2,
.imgTextGroupM3,
.imgTextGroupM5 {
     display: flex;
     align-items: stretch;
     flex-wrap: wrap; 
     box-sizing: border-box;
     max-width: 184rem;
     margin: 0 auto !important;
     gap: 15px;
  }

 .imgTextGroupF2 {
    margin: 0 auto;
    padding: 0 1rem;
    max-width: calc(184rem * 0.8);
 }
 .imgTextGroupCM {
    width: 100%;
    max-width: 1200px !important;
    justify-content: space-between;
}
.imgTextGroupM5 {
    gap: 6rem;
}

 /* 子要素 */
  .imgTextGroupL2 > div {
     box-sizing: border-box;
     width:50%;
     display: flex;
     flex-direction: column;
     align-items: stretch;
     padding: 3rem 3rem 0;
 }
.imgTextGroupM2 > div 
 {
     box-sizing: border-box;
     width: 33.333%;
     display: flex;
     flex-direction: column;
     align-items: stretch;
     padding: 3rem 3rem 0;
 }
.imgTextGroupM2-2 > div,
.imgTextGroupM3 > div,
.imgTextGroupM5 > div {
     box-sizing: border-box;
     width: calc((100% - 30px) / 3);
     display: flex;
     flex-direction: column;
     align-items: stretch;
 }

.imgTextGroupS2 > div,
 .imgTextGroupF2 > div  
 {
     box-sizing: border-box;
     width: 25%;
     display: flex;
     flex-direction: column;
     align-items: stretch;
     padding: 0 3rem;
 }
 .imgTextGroupF2 > div {
    margin: 0 auto;
 }
 .imgTextGroupTR > div {
    box-sizing: border-box;
    width:50%;
    display: flex;
    flex-direction: row;
    align-items: stretch;
    padding: 3rem 3rem 0;
 }
 body > main > div.wpPage > div.imgTextGroupTR > div:last-child {
    margin: 0 0 4rem !important;
 }
 .imgTextGroupCM > div {
    display: flex;
    flex-direction: column;
    width: 50%;
    max-width: 500px;
 }
 .imgTextGroupM5 > div {
    width: calc((100% - 24rem) / 5);
 }

 /*子要素の中の画像*/
 .imgTextGroupL2 > div > img,
 .imgTextGroupM2 > div > img,
 .imgTextGroupM2-2 > div > img,
 .imgTextGroupM3 > div > img,
 .imgTextGroupS2 > div > img,
 .imgTextGroupF2 > div > img {
     width: 100%;
     height: auto;
     object-fit: cover; /**/
     display: block;
     margin-bottom: 20px;
 }
 .imgTextGroupTR > div > img {
    width: 50%;
    height: auto;
    object-fit: cover; /**/
    display: block;
}
.imgTextGroupM5 img,
.imgTextGroupM5 .catsubtitle,
.imgTextGroupM5 .enlargeImg {
    margin: 0 0 20px;
}
.imgTextGroupM5 .enlargeImg img {
    margin: 0;
}
.imgTextGroupM5 p {
    line-height: 1.4;
}
.imgTextGroupM5 a {
    text-decoration: none;
}
.imgTextGroupM5 a:hover img,
.imgTextGroupM5 a:hover div {
    opacity: .6;
}
.imgTextGroupM5 a:hover .enlargeImg,
.imgTextGroupM5 a:hover .enlargeImg img,
.imgTextGroupM5 a:hover .enlargeImg ~ div {
    opacity: 1;
    text-decoration: underline;
}


/* M2 見出しテキスト小 */
body > main > div.wpPage > div.imgTextGroupM2 > div > div,
body > main > div.wpPage > div.imgTextGroupM2-2 > div > div,
body > main > div.wpPage > div.imgTextGroupM3 > div > div {
    display: flex;
    flex-direction: column;    
}
/* CM 見出しテキスト中 */
body > main > div.wpPage > div > div.imgTextGroupCM > div > h3 {
    margin-top: 2rem;
}

.imgTextGroupTR h4 { margin-top: 0; }
body > main > div.wpPage > div.imgTextGroupTR > div > div {
    margin-left: 1rem;
}

 /* 本文テキスト */
 .imgTextGroupL2 > div > p,
 .imgTextGroupM2 > div > p,
 .imgTextGroupM2-2 > div > p,
 .imgTextGroupM3 > div > p,
 .imgTextGroupS2 > div > p,
 .imgTextGroupF2 > div > p, 
 .imgTextGroupTR > div > p {
     display: block;
     width: 100%;
     padding: 0;
     box-sizing: border-box;
 }


 
 @media print, screen and (max-width:1023.9px){

/* 親要素 */
.imgTextGroupL2,
.imgTextGroupM2,
.imgTextGroupM2-2,
.imgTextGroupS2,
.imgTextGroupTR {
    box-sizing: border-box;
    margin: 0 1rem !important;
    padding: 0 !important;
}

.imgTextGroupF2 {
    box-sizing: border-box;
    margin: 0 2rem !important;
    padding: 0 !important;
}

.imgTextGroupM2-2 > div {
    width: 100%;
}
     
.imgTextGroupM2,
.imgTextGroupM2-2,
.imgTextGroupTR {
    flex-direction: column;
}
.imgTextGroupCM {
    width: 80%;
    justify-content: space-between;
}
.imgTextGroupM5 {
    gap: 15px;
}

/* 子要素 */
    .imgTextGroupL2 > div,
    .imgTextGroupM2 > div,
    .imgTextGroupS2 > div,
    .imgTextGroupF2 > div {
    margin: 0 !important;
    padding: 2rem 1rem !important;
}

.imgTextGroupM2 > div,
.imgTextGroupTR > div {
    width: 100%;
    flex-direction: row;
    object-fit: cover;
}

body > main > div.wpPage > div.imgTextGroupM2 > div > div,
body > main > div.wpPage > div.imgTextGroupTR > div > div {
    margin-left: 1rem;
}

.imgTextGroupS2 > div,
.imgTextGroupF2 > div {
    box-sizing: border-box;
    width:50%;
    display: flex;
    flex-direction: column;
    align-items: stretch;
    padding: 3rem 3rem 0;
}

.imgTextGroupCM > div {
    width:47%;
}
.imgTextGroupM5 > div {
    width: calc((100% - 30px) / 3);
}

/*子要素の中の画像*/
.imgTextGroupL2 > div > img,
.imgTextGroupS2 > div > img,
.imgTextGroupF2 > div > img {  
width: auto;
max-width: 100%;
height: auto;
max-height: 100%;
border: 0 none;
vertical-align: bottom;
}

.imgTextGroupM2 > div > img {
    width: 30%;
    height: 30%;
    margin-bottom: 0 !important;
}
.imgTextGroupTR> div > img {
    width: 50%;
    height: 50%;
}
.imgTextGroupM5 img,
.imgTextGroupM5 .catsubtitle,
.imgTextGroupM5 .enlargeImg {
    margin: 0 0 10px;
}
.imgTextGroupM5 .enlargeImg img {
    margin: 0;
}

h2.addContents {
    margin-top: 3rem;
    margin-bottom: 0rem;
 }



}

@media print, screen and (max-width:428px){ /*2022スマホ画面iphone12/13proMAX解像度以下*/

.flexList.topNav figcaption h3 { font-size: 1.8rem !important; }/*220802に2.2remから再修正*/
.flexList.topNav figcaption p,
.recommendSlide .slick-slide figcaption { font-size: 1.8rem !important; }/*220802に2remから再修正*/
.catMidList.flexList figcaption { font-size: 1.8rem !important; }
#infoList a { font-size: 1.8rem !important; }

}



/* 投稿ページの余白の調整 */

@media screen and (min-width:1024px){
    body > main > div.wpPage > h3 {
        margin: 0 auto !important;
        padding-bottom: 4rem !important;
        max-width: 1380px;
        width: 100%;
    }
}
/*
@media screen and (max-width:1023.9px) {
    body > main > div.wpPage > h3 {
        margin: 0 auto !important;
        width: 90% !important;
    }
}
*/
@media screen and (min-width:768px) {
    .center { 
        text-align: center;
        width: 100%;
     }
    .companyProfile { 
        width: 100%;
        max-width: 800px;
        display: flex;
        justify-content: center;
        margin: 0 auto;
    }
    .companyProfile div.item1 {
        width: 50%;
        margin: 0 !important;
        padding: 0 !important;
    }
    .companyProfile div.item1 img,
    .companyProfile div.item2 img {
        width: 100%;
    }
    .companyProfile div.item2 {
        width: 50%;
        margin: 0 !important;
        padding: 0 !important;
        text-align: left;
    }
}

    @media screen and (max-width:767.9px){
        .companyProfile {
            flex-direction: column;
        }
        .companyProfile div.item1,
        .companyProfile div.item2 {
            width: 100%;
        }
    }


    #snsSlide > ul > div > div {
        margin: 0 auto !important;
    }

/* 220802依頼分 CompanyProfile */

#companyProfile { box-sizing: border-box !important; padding: 0; }

#companyProfile > div.sectionCP {
    width: 100%;
    background-color: #fff;
}
#companyProfile > div.sectionCP > h2 {
font-size: 4.5rem !important;
}

.sectionCP h3 {
    font-size: 1.8rem;
}

.section03,
.section07 {
    width: 100%;
    padding: 6em 2em;
    height: 60vh;
    margin: 0 auto;
    background-color: #eee;
}
.section09 { padding: 2em; background-color: #eee;}
div.sectionCP.section09 > ul {
    display: flex;
    list-style: none;
    margin-bottom: 1em;
}
#companyProfile > div.sectionCP.section09 > ul > li > figure > img {
    margin-bottom: 1em;
}

div.sectionCP.section09 > ul > li:nth-child(2) {
    margin-left: 1em;
}
.section09 p { font-size: 1.4rem; }
.section09 figcaption { font-size: 2.0rem; }
.section09 h4 { font-size: 1.8rem; margin-top: 1em;}


.parallax {
  width: 100%;
  position: sticky;
  top: 0;
  left: 0;
  z-index: -1;
  background-repeat: no-repeat;
}

.parallax01 {
  background-image: url(/images/bg-tri01.png);
  height: 500px;
  margin: 0 auto 0 0;
  background-size: cover;
  background-position: center;
}

.parallax02 {
  background-image: url(/images/bg-tri02.png);
  height: 350px;
  background-size: cover;
  background-position: top left;

}

.parallax03 {
  background-image: url(/images/bg-tri03.png);
  height: 350px;
  background-size: cover;
  background-position: top right;
}

.parallax04 {
  background-image: url(/images/bg-tri04.png);
  height: 600px;
  background-size: cover;
  background-position: center left;
}
.parallax04 ul { margin: 2em 0; }
.parallax04 li { font-size: 1.6rem; color: #222; list-style: none; }
.parallax04 img { width: 150px; }

.parallax05 {
  background-image: url(/images/bg-tri05.png);
  height: 500px;
  background-size: cover;
  background-position: center right;
}
.parallax05 ul { margin: 2em 0; }
.parallax05 li { font-size: 1.6rem; color: #222; list-style: none; }
.parallax05 img { width: 150px; }

.parallax06 {
  background-image: url(/images/bg-tri06.png);
  height: 450px;
  background-size: cover;
  background-position: center left;
}

.parallax07 {
  background-image: url(/images/bg-tri07.png);
  height: 400px;
  background-size: cover;
  background-position: center right;
}

.parallax08 {
  background-image: url(/images/bg-tri08.png);
  height: 400px;
  background-size: cover;
  background-position: top right;
}

.parallax09 {
  background-image: url(/images/bg-tri09.png);
  height: 400px;
  background-size: cover;
  background-position: top left;
  background-repeat: no-repeat;
}

.parallax10 {
  background-image: url(/images/bg-tri10.png);
  height: 600px;
  background-size: cover;
  background-position: center right;
}
.parallax10 img { width: 150px; }

.parallax11 {
  background-image: url(/images/bg-tri12.png);
  height: 600px;
  background-size: cover;
  background-position: center left;
}

.sectionCP {
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
}

.parallax h2 { font-size: 3.4rem; font-weight: 600; margin-top: 1.5em; margin-bottom: 0.5em; text-shadow: -1px -1px 4px #260f01, -1px 0 4px #260f01, -1px 1px 4px #260f01,0 -1px 4px #260f01, 0 1px 4px #260f01,1px -1px 4px #260f01, 1px 0 4px #260f01,1px 1px 4px #260f01; }
.parallax h3 { font-size: 2.8rem; font-weight: 600; margin-bottom: 1em; text-shadow: -1px -1px 4px #260f01, -1px 0 4px #260f01, -1px 1px 4px #260f01,0 -1px 4px #260f01, 0 1px 4px #260f01,1px -1px 4px #260f01, 1px 0 4px #260f01,1px 1px 4px #260f01;}
.parallax p { color: #000; font-size: 2.2rem; font-weight: 500; text-shadow: -1px -1px 4px #fff, -1px 0 4px #fff, -1px 1px 4px #fff,0 -1px 4px #fff, 0 1px 4px #fff,1px -1px 4px #fff, 1px 0 4px #fff,1px 1px 4px #fff;}

.parallax div { width: 50%; }

.parallax01,
.parallax02,
.parallax03,
.parallax04,
.parallax05,
.parallax06,
.parallax07,
.parallax08,
.parallax09,
.parallax10,
.parallax11 {
    background-color: none;
    color: #fff !important;
    padding: 4rem 2rem 2rem;
}

.parallax02 div,
.parallax04 div,
.parallax06 div,
.parallax09 div { margin-left: auto; margin-right: 2em; }

.parallax08 div { margin: 0 auto; }

 div.parallax.parallax11 > p { margin: 5rem auto 0; width: 70%; }

 #companyProfile > div.parallax > div > h2, 
 #companyProfile > div.parallax > div > h3
  { color: #fff !important; }

  #companyProfile > div.parallax.parallax01 > div > p,
  #companyProfile > div.parallax.parallax02 > div > p,
  #companyProfile > div.parallax.parallax03 > div > p,
  #companyProfile > div.parallax.parallax04 > div > p,
  #companyProfile > div.parallax.parallax05 > div > p,
  #companyProfile > div.parallax.parallax06 > div > p,  
  #companyProfile > div.parallax.parallax07 > div > p,
  #companyProfile > div.parallax.parallax08 > div > p,
  #companyProfile > div.parallax.parallax09 > div > p,
  #companyProfile > div.parallax.parallax10 > div > p,
  #companyProfile > div.parallax.parallax11 > div > p  { width: 100% !important; }

  #companyProfile > div.parallax.parallax10 > div > img {
    margin-bottom: 2em;
  }



  @media print, screen and (max-width:767.9px){

    .parallax div { width: 100%; }
    .parallax p { font-size: 1.8rem; }
    .section03,.section07 {
    width: 100%;
    padding: 0 2em;
    height: 30vh;
    margin: auto;
    background-color: #eee;
}

.section03 h2,.section07 h2 {
    font-size: 3.0rem !important;
  }
  
  #companyProfile > div.parallax > div > p,
  #companyProfile > div.parallax.parallax04 > div > ul,
  #companyProfile > div.parallax.parallax10 > div > h4 {
      background-color: rgba(255, 255, 255, 0.7);
      padding: 0.5em;
  }
  
  #companyProfile > div.parallax.parallax11 > p {
      width: 80vw;
      background-color: rgba(255, 255, 255, 0.7);
      padding: 0.5em;
  
  }
  #companyProfile > div.sectionCP.section03,
#companyProfile > div.sectionCP.section07 {
display: flex;
align-items: center;
justify-content: center;
}


  }

  @media print, screen and (max-width:427.9px){

.section03,.section07 {
    width: 100%;
    padding: 0 1em;
    height: 30vh;
    margin: auto;
     background-color: #eee;
}

    div.sectionCP.section09 { padding: 2rem;  margin: 0 auto; }
div.sectionCP.section09 > ul {
    display: flex;
    flex-direction: column;
    justify-content: center;
    list-style: none;
}
div.sectionCP.section09 > ul > li:nth-child(2) {
    margin: 0 auto;
}
#companyProfile > div.sectionCP.section09 > ul:nth-child(1) > li:nth-child(1) { text-align: center !important; }
.section09 p { font-size: 1.6rem; line-height: 1.5; margin: 0 !important; }
.section09 figcaption { font-size: 1.4rem; }
.section09 h4 { font-size: 1.8rem; margin-top: 1em;}
#companyProfile > div.sectionCP.section09 > ul:nth-child(1) > li:nth-child(1) > img { width: 50vw; margin: 1em auto;}

#companyProfile > div.sectionCP.section09 > ul:nth-child(1) > li:nth-child(2) > p { font-size: 1.6rem !important; margin-bottom: 1em !important; }
#companyProfile > div.sectionCP.section09 > ul > li > figcaption { font-size: 1.8rem !important; line-height: 1.5 !important; padding: 1em 0;}

#companyProfile > div.sectionCP.section09 > div > h4 { font-size: 1.8rem; margin-bottom: 0.5em;}


.parallax01,.parallax02,.parallax03,.parallax04,.parallax05,.parallax06,.parallax07,.parallax08,.parallax09,.parallax10,.parallax11 {
    height: auto;
  }

  }

/*会員登録ページ修正*/

#SecondaryProcessingSales > a,
#ECsales > a,
#notforSale > a,
#GeneralCustomer > a
 {
    color: #fff;
    text-decoration: none;
}

#MembershipType {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    padding: 0 !important;
}

#MembershipType div {
    width: 35%;
    background-color: #222;
    font-size: 2rem;
    text-align: center;
    margin: 0 0.5em;
    padding: 0.5em;
    align-items: center;
    margin-bottom: 1em;
    display: flex;
    justify-content: center;
    align-items: center;
}

#MembershipType > div > a {
    color: #fff;
    line-height: 1.5;
    text-decoration: none;
}

body > main > div.membership > section:nth-child(1) > h2:nth-child(4) {
    margin-bottom: 1em !important;
}

#MembershipType > div > a > span {
    font-size: 1.6rem;
}

@media print, screen and (max-width:767.9px){
    #MembershipType {
        justify-content: center;
        padding-top: 0 !important;
    }
    #MembershipType div {
        width: 90%;
        padding: 0.5em 2em;
    }
}


/*20220823 コーディネート集テンプレ部分改修*/

#catMain > section > div.wpPage > h6 {
    margin: 1em auto 2em;
    text-align: center;
}
#catMain > section > div.wpPage > ul {
    display: flex !important;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
    width:100%;
    max-width: 1050px;
}

#catMain > section > div.wpPage > ul > li {
    margin: 0 0.5em 1em;
}



/*20220823 会社概要ページ修正*/
body > main > section > div > h2 {
    text-align: center !important;
    margin: 1em auto 2em !important;
    padding: 0;
    width: auto;
}


/*20220825 フォーム幅修正*/

@media print, screen and (min-width:768px){ /* 768px以上（PCとか） */
table.form_700 {
    width: 100%;
    max-width: 700px;
    margin: 0 auto;
}

table.form_700 th {
    width: 25%;
    background-color: #eee;
}
table.form_700 th,table.form_700 td { display: table-cell; }

#zip { width: 130px;}
#tel,#fax { width:300px; }
}

@media print, screen and (max-width:767.9px){   /* 768px未満　SP用 */
    table.form_700 {
        border-left: 1px solid;
        border-right: 1px solid;
    }
    table.form_700 th,table.form_700 td { 
        display: block; 
    }
    table.form_700 th { 
        width: 100%;
        background-color: #eee;
}
#zip { width: 130px; }

}

/*20220901 フォーム修正*/
.w300 { width: 300px !important; }
.w130 { width: 130px !important; }

@media print, screen and (max-width:339.9px){   /* 小さなスマホ用 */
    .w300 { width: 100% !important; }
}


/*20220906 couponCP_LP*/

section#couponLP {
    width: 100%;
    max-width: 1200px;
    margin: 0 auto;
    text-align: center;
    padding-top: 0 !important;
    padding-bottom: 0 !important;
}

.couponLP__innner {
    width:100%;
    max-width: 1000px;
    margin: 0 auto;
}
.couponIMG {
/*
    background: url("../images/common/couponCP/cpn_bg01.webp") no-repeat top center;*/
    margin: -60px auto 60px;
    padding: 0;
    text-align: center;    
}
#couponLP > div > div > ul.cpn01 {
    display: flex;
    justify-content: center;
    padding-top: 200px;
}

#couponLP > div > div.couponIMG > a > img {
    margin: 50px auto;
}


#couponLP > div > div.couponIMG > p {
    font-size: 2.4rem;
    line-height: 1.5;
    font-weight: 500;
    text-align: center;
}

#couponLP > div > div.couponIMG > div {
    display: flex;
    justify-content: flex-end;
    margin-top: 30px;
    font-size: 2.2rem;
}

#couponLP > div > div.couponIMG > div > ul > li {
    display: -webkit-flex;
    display: -ms-flex;
    display: flex;
    align-items: baseline;
  }
 
#couponLP > div > div.couponIMG > div > ul > li:before {
    content: "※";
    margin-right: 2px;
}

#couponLP > div > h2 {
    border-bottom: solid 1px #00179E;
    margin: 20px 0 0;
}

#couponLP > div {
    margin: 0 auto;
}

#couponLP > div > div.riyou {
    width: 100%;
    max-width: 800px;
    margin: 0 auto;
    display: flex;
    justify-content: space-between;
}

#couponLP > div > div.riyou > div {
    margin: 40px auto;
}

#couponLP > div > div.riyou > div:nth-child(1) {
    margin-right: 0;
    flex-basis: 80%;
    margin-left: 40px;
}
#couponLP > div > div.riyou > div > img {
    width: 100%;
    margin-left: 40px;
}

#couponLP > div > div.riyou > div:nth-child(1) > ol > li {
    text-align: left;
    font-size: 2.6rem;
    line-height: 1.5;
    list-style-type: decimal;
}

#couponLP > div > p {
    margin-top: 50px;
    font-size: 3.2rem;
    font-weight: 600;
}

#couponLP > div > div#cpnCode {
    width: 70%;
    border:  double thin ;
    font-size: 5.0rem;
    font-weight: 800;
    padding: 20px;
    margin: 50px auto;
    text-align: center;
}

#couponLP > div > div:nth-child(3) > div:nth-child(1) > ol > li:nth-child(2),
#couponLP > div > div:nth-child(4) > div:nth-child(1) > ol > li:nth-child(2) {
list-style: none !important;
width: 60%;
}
.cpnpc-only { display: block !important;}
.cpnsp-only { display: none !important;}


@media screen and (max-width:767.9px){
#couponLP > div > div.riyou {
    width: 100%;
    margin: 0 auto;
    padding: 10px;
    display: flex;
    flex-direction: column;
    justify-content: center;
}
#couponLP > div > div.riyou > div {
     flex-basis: 100%;
}
#couponLP > div > div > div > img {
    margin: 20px auto !important;
    height: 60vh;
    width: auto;
}
#couponLP > div > div > div:nth-child(2) {
    margin-top: 0;
}
.cpnpc-only { display: none !important;}
.cpnsp-only { display: block !important;}
.couponIMG {
/*    background: url("../images/common/couponCP/cpn_bg02.webp") no-repeat top center;*/
    margin: 0 auto 60px;
    padding: 0;
    text-align: center;    
}
#couponLP > div > div > ul.cpn01 {
    display: flex;
    justify-content: center;
    padding-top: 50px;
}



}

/*20220908*/

@media screen and (max-width:1023.9px){
#topSection > h2,
body > main > section:nth-child(3) > h2,
body > main > section.recommendList > h2,
body > main > section.recommendList > section:nth-child(4) > h2,
body > main > section.recommendList > section:nth-child(7) > h2,
body > main > section.recommendList > section:nth-child(8) > h2 {
    font-size: 3rem;
}


#topSection > ul > li > a > figure > figcaption > h3 {
    font-size: 1.8rem !important;
}

}

/*20220915*/
body > main > section.recommendList > section:nth-child(8) {
    padding-top: 10rem;
}

body > main > section.recommendList > section > h2 {
    margin: 0 0 2em;
}

/* 20230614 ul.insta,other justify-content: space-between; 記述削除*/

#topSns ul.insta,
#topSns ul.other {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    width: 100%;
    max-width: 1200px;
    margin: 0 auto 30px;
}
#topSns ul.insta > li {
    width: calc((100% - 6px) / 3);
    gap: 0 30px;
    line-height: 1.5;
    margin-bottom: 2em;
}

#topSns ul.insta > li > a {
    display: flex;
    flex-wrap: nowrap;
    justify-content: flex-start;
    align-items: center;
    text-decoration: none !important;
}
@media (hover: hover) {
#topSns a:hover { opacity: .6;}
}

#topSns ul.other { justify-content: center; margin: 0 0 12rem; padding: 0 0 12rem; max-width: none; border-bottom: 1px solid #DDD;}
#topSns ul.other li { margin: 0 5rem;}
#topSns ul.other li:first-child img { width: 35px;}
#topSns ul.other li:nth-child(5) img { width: 40px;}

@media screen and (max-width:1023.9px) {

    body > main > section.recommendList > section > h2 {
        margin: 2em 0;
    }
        
    #topSns ul.insta > li {
        width: calc((100% - 30px) / 2);
        gap: 0 30px;
        margin-bottom: 1em;
    }    
}

@media screen and (max-width:768px) {
    #topSns ul.insta,
    #topSns ul.other {
        display: flex;
        flex-direction: column;
        flex-wrap:nowrap;
        justify-content: center;
        align-items: center;
        width: 100%;
        gap: 30px;
    }
    #topSns ul.insta > li {
        width: 100%;
    }
    #topSns ul.other { flex-direction: unset; gap: 0; margin: 0 0 5rem; padding: 0 0 5rem;}
    #topSns ul.other li { margin: 0 1rem;}
}


/* 壁面緑化 */

#GreenBox {
    overflow-x: scroll;
}

#GreenBox > img {
    width: 2198px !important;
    height: 373px !important;
    max-width: 2198px !important;
    max-height: 373px !important;
}

body > main > div.wpPage > div > div.wallgreen01 {
    background-color: #000;
    width: 100%;
    padding: 10px;
}

body > main > div.wpPage > div > div.wallgreen01 > ul {
    display: flex;
    justify-content: space-between;
    align-items: center;
    color: #fff;
    font-weight: 600;
}

body > main > div.wpPage > div > div.wallgreen01 > ul > li:nth-child(2) {
    flex-grow: 2;
    text-align: center;
}


@media screen and (max-width:768px) {
  
body > main > div.wpPage > div > div.wallgreen01 > ul {
    flex-wrap: wrap;
}

body > main > div.wpPage > div > div.wallgreen01 > ul > li:nth-child(1) { order: 1; text-align: left; width: 50%; }
body > main > div.wpPage > div > div.wallgreen01 > ul > li:nth-child(2) { order: 3; text-align: center; width: 100%; }
body > main > div.wpPage > div > div.wallgreen01 > ul > li:nth-child(3) { order: 2; text-align: right; width: 50%; }

}

@media screen and (max-width:768px) {
    body > main > div.wpPage > div > div.wallgreen01 > ul > li:nth-child(2) { padding-top: 1em; }
}





/* membership（業務会員登録）全改修 */
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@300;400;500;600;700;800;900&display=swap');

/* ボタンのスタイル */
.page-top {
    /* buttonタグのリセットCSS */
    border: none;
    cursor: pointer;
    outline: none;
    padding: 0;
    appearance: none;
  
    /* ボタンの装飾 */
    position: fixed;
    left: 10px;
    bottom: 30px;
    z-index: 100;
    width: 50px;
    height: 50px;
    border-radius: 50%;
    background-color: #115582;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all 0.3s ease;
    opacity: 0.5;
  }
  
  /* 矢印のスタイル */
  .page-top::before {
    content: "";
    width: 12px;
    height: 12px;
    margin-bottom: -6px;
    border-top: solid 3px #fff;
    border-right: solid 3px #fff;
    transform: rotate(-45deg);
  }
  
  /* ホバー時のスタイル */
  .page-top:hover {
    /*transform: scale(1.1);*/
    opacity: 1.0;
  }

div.membershipNew { 
    overflow-x: hidden;
    word-break: keep-all;
    line-break: strict;
    word-wrap: break-word;
    overflow-wrap: break-word;
 }

div.membershipNew h1 { font-size: 4.4rem; font-weight: 900 !important; margin: 0; }
div.membershipNew h2 { font-size: 4rem; font-weight: 900 !important; margin: 1em 0; position: relative; top: 0; left: 0; text-align: center;}
div.membershipNew h2::before { position:absolute; bottom: -5px; left:50%; content:''; width: 400px; border-bottom: 3px double yellowgreen; transform: translate(-50%); }
div.membershipNew h3 { font-size: 3rem; font-weight: 900 !important; margin: 0; }
div.membershipNew h4 { font-size: 2.2rem; font-weight: 600 !important; margin: 0 0 16px; }
div.membershipNew h5 { font-size: 1.8rem; font-weight: 600 !important; margin: 0 0; }
body > main > div.membershipNew > div:nth-child(5) > h5:nth-child(3),
div.membershipNew p { font-size: 2.2rem; font-weight: 400; line-height: 1.8; padding-bottom: 2em; }


body > div.membershipNew > div:nth-child(5) > h3,
body > div.membershipNew > div.bg_lightgreen > h3 { margin-bottom: 20px; }
#bluecard > h5,
#whitecard > h5,
#greencard > h5:nth-child(3),
body > div.membershipNew > div.bg_lightgreen > h5,
body > div.membershipNew > div:nth-child(7) > h5 { margin-bottom: 40px; }

#bluecard > h5 { width:100%; max-width: 1000px; margin: 0 auto 40px; }
#normalcard > a > h4,
#normalcard > a > h5 {
    text-decoration: none;
}

div.membershipNew {
    width: 100%;
    text-align: center;
    color: #222;
}

div.bg_lightblue {
    width: 100%;
    background-color: #ecf7fe;
    margin: 0;
    padding: 30px 0;
    text-align: center;
}

div.bg_white {
    width: 100%;
    background-color: #fff;
    margin: 0;
    padding: 30px 0;
    text-align: center;
}

div.bg_lightgreen {
    width: 100%;
    background-color: #F0FFDF;
    margin: 0;
    padding: 30px 0;
    text-align: center;
}

section.membershipNew {
    width: 100%;
    max-width: 1380px;
    margin: 0 auto;
}

div.mw1000px {
    width: 100%;
    max-width: 1000px;
    margin: 0 auto;
    text-align: center;
}

div.roundSquare {
    width: 100%;
    border-radius: 20px;
    border: 1px solid #ccc;
    box-shadow: 2px 2px 6px 0px rgba(0,0,0,0.4);
    background-color: #fff;
    padding: 1.8rem 18rem;
    margin-top: 30px;
    margin-bottom: 50px;
    text-align: left;
}

body > div.membershipNew > div > section > div > ul,
body > main > div.membershipNew > div > section > div > ul {    /*会員カード*/
    display: flex;
    width: 100%;
    max-width: 800px;
    justify-content: space-between;
    margin: 0 auto;
}

body > main > div.membershipNew > div > section > div > ul > li {
    display: flex;
    flex-direction: column;
}

body > main > div.membershipNew > div > section > div > ul > li > img {
    width: 100%;
    max-width: 150px;
    margin-bottom: 20px;
}

body > main > div.membershipNew > div > section > div > ul > li > p {
    font-size: 1.8rem;
    line-height: 1.6;
    width: 100%;
    max-width: 150px;
}
body > main > div.membershipNew > div > section > div > ul > li > p.btns {
    text-align: center;
    align-self: flex-end !important;
    margin-top: auto;    
}

body > main > div.membershipNew > div.bg_white > ul {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    max-width: 600px;
    margin: 30px auto 80px;
    gap: 0 10px;
}


body > main > div.membershipNew > div.bg_white > ul > li > a {
    width: calc(580px / 3);
}


body > main > div.membershipNew > div.bg_white > h2 {
    margin: 30px auto 50px;
}

div.nagare__inner {
    display: flex;
    justify-content: center;
    gap: 50px;
    width: 100%;
    max-width: 800px;
    margin: 30px auto 80px;
}

body > main > div.membershipNew > div.bg_white > div > ul > li { line-height: 2.0; }

body > main > div.membershipNew > div.bg_white > div > ul > li:nth-child(1) {
    font-size: 2rem;
    font-weight: 600;
}

body > main > div.membershipNew > div.bg_white > div > ul > li:nth-child(2) {
    font-size: 1.8rem;
    font-weight: 600;
}


body > main > div.membershipNew > div.bg_white > div > ul > li > ol > li { 
    line-height: 3.0;
    font-size: 1.8rem;
    font-weight: 600;
    list-style-type: decimal;
    list-style-position:inside;
    margin-left: 1em;
}

body > main > div.membershipNew > div.bg_white > ul.merit { 
    display: flex; 
    flex-direction: column; 
    align-items: flex-start; 
    justify-content: center; 
    width: 100%;
    max-width: 650px;
    margin: 0 auto 80px;
}

body > main > div.membershipNew > div.bg_white > ul.merit > li { 
    display: flex; 
    align-items: center; 
    font-size: 2.6rem; 
    font-weight: 600;
    background-position: top left;
    background-repeat: no-repeat;
    background-size: auto;
    padding-left: 120px;
    padding-bottom: 20px;
    line-height: 100px;
    white-space: normal ;
}
body > main > div.membershipNew > div.bg_white > ul.merit > li.m01 { background-image: url( ../images/common/membership/merit1.png); }
body > main > div.membershipNew > div.bg_white > ul.merit > li.m02 { background-image: url( ../images/common/membership/merit2.png); }
body > main > div.membershipNew > div.bg_white > ul.merit > li.m03 { background-image: url( ../images/common/membership/merit3.png); }
body > main > div.membershipNew > div.bg_white > ul.merit > li.m04 { background-image: url( ../images/common/membership/merit4.png); }
body > main > div.membershipNew > div.bg_white > ul.merit > li.m05 { background-image: url( ../images/common/membership/merit5.png); }


body > main > div.membershipNew > div > h3 {
    margin-bottom: 20px;
}

body > main > div.membershipNew > div:nth-child(3) > p { text-align: center;}


div.membershipNew > div > ul.card,
body > main > div.membershipNew > div.bg_white > ul.card {
    display: flex;
    justify-content: space-around;
    width: 100%;
    max-width: 600px;
    margin: 0 auto 40px;
}
/*
body > main > div.membershipNew > div.bg_white > ul{
    display: flex;
    justify-content: space-around;
    width: 100%;
    max-width: 800px;
    margin: 0 auto 40px;
}
*/
body > main > div.membershipNew > div > ul.card > li {
    text-align: center;
}

body > main > div.membershipNew > div > ul.card > li > img {
    width: 100%;
    max-width: 250px;
}

body > main > div.membershipNew > div > ul.card > li:nth-child(2) > div {
    border: solid 1px #000666;
    background-color: #fff;
    width: 100% !important;
    max-width: 250px;
    text-align: left;
    padding: 0.8em 1.5em;
    font-weight: 600;
    font-size: 2.2rem;
    line-height: 2;
    white-space: nowrap !important;
    margin-bottom: 20px;
}

body > main > div.membershipNew > div:nth-child(7) > ul > li:nth-child(2) {
    width: 100%;
    max-width: 250px;
}

body > main > div.membershipNew > div > ul.card > li:nth-child(2) > a { text-decoration: none; }
body > main > div.membershipNew > div > ul.card > li:nth-child(2) > a > div {
    background-color: #FF0054;
    color: #fff;
    font-weight: 600;
    font-size: 2.2rem;
    text-align: center;
    padding: 1em;
}



body > main > div.membershipNew > div > div.bc__inner,
body > main > div.membershipNew > div > div.wc__inner,
body > main > div.membershipNew > div > div.gc__inner {
    width: 100%;
    max-width: 800px;
    margin: 0 auto 40px;
}

body > main > div.membershipNew > div > div.bc__inner > h4,
body > main > div.membershipNew > div > div.wc__inner > h4,
body > main > div.membershipNew > div > div.gc__inner > h4 {
    background: #6677aa;
    padding: 1em;
    color: #fff;
    border-radius: 30px 30px 0 0 ;
    margin-bottom: 0;
}

div.roundSquareBox {
    border: solid 1px #6677aa;
    background-color: #fcfcfc;
    margin: 0 auto 30px;
    padding: 2em
}

body > main > div > div:nth-child(4) > p { text-align: center; }

body > main > div.membershipNew > div > div > div > ol {
    list-style-position: inside;
	margin-left: 3.5em; /* サイトに合せて調整 */
    font-size: 1.8rem;
    font-weight: 600;
    margin-bottom: 20px;
}

body > main > div.membershipNew > div > div > div > ol > li {
	list-style-type: none;
	counter-increment: cnt;
	position: relative;
    line-height: 2;
}

body > main > div.membershipNew > div > div > div > ol > li:before {
	content: "(" counter(cnt) ")";
	display: inline-block;
	margin-left: -3.5em; /* サイトに合せて調整 */
	width: 3em; /* サイトに合せて調整 */
	text-align: right;
	position: absolute;
	top: 0;
	left: 0;
}


/* 続き数字のリスト */
body > main > div.membershipNew > div:nth-child(4) > div > div:nth-child(4) > ol,
body > main > div.membershipNew > div:nth-child(5) > div > div:nth-child(4) > ol,
#greencard > div > div:nth-child(4) > ol {
    list-style-position: inside;
	margin-left: 3.5em; /* サイトに合せて調整 */
    font-size: 1.8rem;
    font-weight: 600;
    margin-bottom: 20px;
    counter-reset: cnt 3;
}

body > main > div.membershipNew > div:nth-child(5) > div > div > ol,
body > main > div.membershipNew > div:nth-child(5) > div > div:nth-child(4) > ol {
    list-style-position: inside;
	margin-left: 3.5em; /* サイトに合せて調整 */
    font-size: 1.8rem;
    font-weight: 600;
    margin-bottom: 20px;
}

body > main > div.membershipNew > div:nth-child(4) > div > div > ol > li,
body > main > div.membershipNew > div:nth-child(5) > div > div:nth-child(4) > ol > li {
	list-style-type: none;
	counter-increment: cnt;
	position: relative;
    line-height: 2;
}

body > main > div.membershipNew > div:nth-child(4) > div > div > ol > li:before,
body > main > div.membershipNew > div:nth-child(5) > div > div > ol > li:before {
	content: "(" counter(cnt) ")";
	display: inline-block;
	margin-left: -3.5em; /* サイトに合せて調整 */
	width: 3em; /* サイトに合せて調整 */
	text-align: right;
	position: absolute;
	top: 0;
	left: 0;
}

#bluecard > div > div:nth-child(4) > ol > li:nth-child(1) { line-height: 1.5; }
#bluecard > div > div:nth-child(4) > ol > li:nth-child(1) > p { padding-bottom: 0 !important; }

body > main > div.membershipNew > div > div > div > p.kome {
    font-size: 1.6rem;
    font-weight: 600;
    text-align: left;
    padding-left: 4em;
    padding-bottom: 0;
}
body > main > div.membershipNew > div > div > div > p.attention,
body > main > div.membershipNew > div:nth-child(5) > div > p.attention,
#greencard > div > p {
    font-size: 2rem;
    font-weight: 600;
    text-align: left;
    padding-left: 3em;
    padding-bottom: 1em;
    color: #cc0000;
}
body > main > div.membershipNew > div > div > div > p.attention_bk {
    font-size: 2rem;
    font-weight: 600;
    text-align: left;
    padding-bottom: 1em;
    color: #000;
}


body > main > div.membershipNew > div:nth-child(7) > ul.nc_flex {
    display: flex;
    justify-content: center;
}

ul.nc_flex > li.nc_flex_item01 {
    width: 100% !important; 
    max-width: 180px !important; 
    font-size: 2.4rem !important;
    font-weight: 600 !important;
}

ul.nc_flex > li { text-align: left; }

ul.nc_flex > li.nc_flex_item02 { 
    width: 100% !important; 
    max-width: 100px !important; 
}
ul.nc_flex > li.nc_flex_item02 img {
    width: 100% !important;
    max-width: 100px !important;
}

ul.nc_flex > li.nc_flex_item03 { 
    width: 100%; 
    max-width: 520px; 
    font-size: 2rem;
    font-weight: 600;
    padding: 0 0 0 1em;
}

@media screen and (max-width:768px) {    /*タブレット表示*/

div.roundSquare {
    width: calc( 100% - 20px );
    margin: 30px 10px 50px;
    padding: 1.8rem 8rem;
}

body > main > div.membershipNew > div > section > div > ul {    /*会員カード*/
    display: flex;
    width: calc( 100% - 20px );
    justify-content: space-between;
    margin: 0 10px;
}


body > main > div > div:nth-child(4) > ul  > li { width: 100%; } 
body > main > div.membershipNew > div.bg_white > ul > li > a { width: 100%; }



div.nagare__inner {
    width: 100%;
    max-width: none;
    margin: 30px 10px 80px;
}



body > main > div.membershipNew > div.bg_white > ul.merit {
    display: flex;
    justify-content: space-around;
    width: 500px;
    max-width: none;
    margin: 0 auto;
}

body > main > div.membershipNew > div.bg_white > ul.merit > li { 
    display: flex; 
    align-items: center; 
    font-size: 2.0rem; 
    font-weight: 600;
    background-position: top left;
    background-repeat: no-repeat;
    background-size: auto;
    padding-left: 80px;
    padding-bottom: 20px;
    line-height: 1.5;
    height:90px;
    white-space: normal;
    line-break: normal;
    word-break: normal;
    overflow-wrap: normal;
}
body > main > div.membershipNew > div.bg_white > ul.merit > li.m01 { background-image: url( ../images/common/membership/merit1.png); background-size: 70px; }
body > main > div.membershipNew > div.bg_white > ul.merit > li.m02 { background-image: url( ../images/common/membership/merit2.png); background-size: 70px; }
body > main > div.membershipNew > div.bg_white > ul.merit > li.m03 { background-image: url( ../images/common/membership/merit3.png); background-size: 70px; }
body > main > div.membershipNew > div.bg_white > ul.merit > li.m04 { background-image: url( ../images/common/membership/merit4.png); background-size: 70px; }
body > main > div.membershipNew > div.bg_white > ul.merit > li.m05 { background-image: url( ../images/common/membership/merit5.png); background-size: 70px; }



body > main > div.membershipNew > div > h3.fc_red {
    margin-bottom: 10px;
}
body > main > div > div:nth-child(4) > p { text-align: center; }

body > main > div.membershipNew > div > div.bc__inner,
body > main > div.membershipNew > div > div.wc__inner,
body > main > div.membershipNew > div > div.gc__inner {
    width: calc( 100% - 20px );
    max-width: none;
    margin: 0 10px 40px;
}

body > main > div.membershipNew > div > h3 {
    font-size: 2.6rem;
    width: calc( 100% - 20px );
    margin: 0 10px 40px;
}
div.membershipNew h5 { max-width: 600px; margin: 0 auto;}

}

@media screen and (max-width:479.9px) {    /* スマホ表示用 */

div.roundSquare {
    width: calc( 100% - 20px );
    margin: 30px 10px 50px;
    padding: 1.8rem 3rem;
}

div.membershipNew h2 { font-size: 3.2rem; font-weight: 900 !important; margin: 1em 0; position: relative; top: 0; left: 0; }
div.membershipNew h2::before { position:absolute; bottom: -5px; left:50%; content:''; width: 100%; border-bottom: 3px double yellowgreen; transform: translate(-50%); }


body > main > div.membershipNew > div > section > div > ul {    /*会員カード*/
    display: flex;
    flex-wrap: wrap;
    width: calc( 100% - 20px );
    justify-content: space-between;
    margin: 0 10px;
    gap: 0 20px;
}

body > main > div.membershipNew > div > section > div > ul > li {
    display: flex;
    flex-direction: column;
    width: calc( 50% - 20px );
    margin: 0 auto;
}

body > main > div.membershipNew > div > section > div > ul > li > img {
    width: 100%;
    max-width: none;
    margin-bottom: 20px;
}
body > main > div > div:nth-child(3) > section > div > ul > li > p { margin: 0 auto; }

body > main > div.membershipNew > div.bg_white > ul:nth-child(1) {/*ページ内リンク*/
    display: flex;
    justify-content: center;
    width: 80%;
    max-width: none;
    margin: 0 auto 40px;
    gap: 20px;
}

#nagare, #merit, #hitsuyou {
    width: calc( 100% - 20px );
    margin: 0 10px 25px;
}

div.membershipNew h4 {
    width: calc( 100% - 20px );
    margin: 0 10px 25px;
}

div.nagare__inner {
    display: flex;
    flex-direction: column;
    justify-content: center;
    width: calc( 100% - 20px );
    max-width: none;
    margin: 30px 10px 80px;
}

div.nagare__inner > ul:nth-child(1) > li:nth-child(1),
div.nagare__inner > ul:nth-child(2) > li:nth-child(1) { margin-bottom: -10px; }
div.nagare__inner > ul > li:nth-child(1),
div.nagare__inner > ul > li:nth-child(2) {
    text-align: center;
    background-color: #ddFFcc;
}
div.nagare__inner > ul > li:nth-child(2) { margin-bottom: 20px; }

body > main > div.membershipNew > div.bg_white > ul.merit { 
    display: flex; 
    flex-direction: column; 
    align-items: flex-start; 
    justify-content: center; 
    width: calc( 100% - 20px );
    max-width: none;
    margin: 0 10px;
}

body > main > div.membershipNew > div.bg_white > ul.merit > li { 
    display: flex; 
    align-items: center; 
    font-size: 2.19rem; 
    font-weight: 600;
    background-position: top left;
    background-repeat: no-repeat;
    background-size: auto;
    padding-left: 70px;
    padding-bottom: 20px;
    line-height: 1.5;
    height: 70px;
}
body > main > div.membershipNew > div.bg_white > ul.merit > li.m01 { background-image: url( ../images/common/membership/merit1.png); background-size: 60px; }
body > main > div.membershipNew > div.bg_white > ul.merit > li.m02 { background-image: url( ../images/common/membership/merit2.png); background-size: 60px; }
body > main > div.membershipNew > div.bg_white > ul.merit > li.m03 { background-image: url( ../images/common/membership/merit3.png); background-size: 60px; }
body > main > div.membershipNew > div.bg_white > ul.merit > li.m04 { background-image: url( ../images/common/membership/merit4.png); background-size: 60px; }
body > main > div.membershipNew > div.bg_white > ul.merit > li.m05 { background-image: url( ../images/common/membership/merit5.png); background-size: 60px; }

body > main > div.membershipNew > div > h3.fc_red {
    font-size: 2.4rem; 
    margin-bottom: 10px;
}

body > main > div.membershipNew > div:nth-child(3) > p {
    font-size: 2.0rem;
}

div.membershipNew > div > ul.card {
    display: flex;
    flex-direction: column;
    justify-content: center;
}

body > main > div.membershipNew > div > ul.card > li:nth-child(2) > div {
    border: solid 1px #000666;
    background-color: #fff;
    width: 80% !important;
    max-width: none;
    text-align: left;
    padding: 0.8em 1.5em;
    font-weight: 600;
    font-size: 2.2rem;
    line-height: 2;
    white-space: nowrap !important;
    margin: 20px auto;
}

/*body > main > div.membershipNew > div:nth-child(5) > ul > li:nth-child(1),
body > main > div.membershipNew > div:nth-child(5) > ul.card  > li:nth-child(2),*/
#bluecard > ul > li:nth-child(2),
#whitecard > ul > li:nth-child(2),
#greencard > ul > li:nth-child(2),
#normalcard > ul.card > li:nth-child(2) {
    width: 80% !important;
    max-width: none;
    margin: 0 auto;
}
/*

body > main > div.membershipNew > div:nth-child(5) > ul.card  > li:nth-child(2) > a > div { width: 100% !important; }
body > main > div.membershipNew > div:nth-child(5) > ul > li:nth-child(1) div,
body > main > div.membershipNew > div:nth-child(5) > ul > li:nth-child(2) > div {
    border: solid 1px #000666;
    background-color: #fff;
    width: 100% !important;
    max-width: none;
    text-align: left;
    padding: 0.8em 1.5em;
    font-weight: 600;
    font-size: 2.2rem;
    line-height: 2;
    white-space: nowrap !important;
    margin: 20px auto;
}*/

body > main > div.membershipNew > div > ul.card > li:nth-child(2) > a > div {
    background-color: #FF0054;
    color: #fff;
    font-weight: 600;
    font-size: 2.2rem;
    text-align: center;
    width: 80% !important;
    max-width: none;
    padding: 1em;
    margin: 0 auto 20px;
}

div.roundSquareBox {
    width: calc( 100% - 20px );
    max-width: none;
}

body > main > div.membershipNew > div > div > div > ol {
    list-style-position: inside;
	margin-left: 1.5em; /* サイトに合せて調整 */
    font-size: 1.8rem;
    font-weight: 600;
    margin-bottom: 20px;
}
body > main > div.membershipNew > div:nth-child(4) > div > div.roundSquareBox > ol > li {
	list-style-type: none;
	counter-increment: cnt;
	position: relative;
    line-height: 1.5;
    margin-bottom: 1rem;
}

body > main > div.membershipNew > div:nth-child(4) > div > div.roundSquareBox > p.kome, 
body > main > div.membershipNew > div:nth-child(4) > div > div.roundSquareBox > p.attention { padding-left: 1.5em }


body > main > div.membershipNew > div:nth-child(4) > div > div.roundSquareBox p.attention_bk {
 padding: 0 1rem;
}

#whitecard > h5,
#greencard > h5,
#normalcard > h5 {
    width: calc( 100% - 20px );
    margin: 0 10px 2em;
    text-align: left;
}


#normalcard > ul {
    width: calc( 100% - 20px );
    margin: 0 10px;
    flex-wrap: wrap;    
    justify-content: flex-start;
}

#normalcard > ul:nth-child(5),
#normalcard > ul:nth-child(6) {
    background-color: #f3f4ff;
    padding: 1em;
}

#normalcard > ul.nc_flex > li.nc_flex_item01,
#normalcard > ul.nc_flex > li.nc_flex_item02 {
    width: calc( (100% - 20px) / 2 );
}

#normalcard > ul:nth-child(5) > li.nc_flex_item03,
#normalcard > ul:nth-child(6) > li.nc_flex_item03 { width: 100%; padding: 0; }

#normalcard > ul:nth-child(5) { margin-bottom: 2em; }

}


/*20221004追記 事例・コーディネートページ*/
#caseStudySearchForm > dl > dt { 
    border: none !important;
    margin: 1em 0 0.5em 1em;
    padding: 0;
    border: none;
 }

 #kw_search {
    border: #000666 solid 1px;
    margin: 10px 0;
    background-color: rgb(240, 240, 240);
}

#kw_search > ul {
    display: flex;
    justify-content: space-between;
    margin-bottom: 0.5em;
}

.sbtn {
    border: #000666 solid 1px;
    padding: 0.5em;
    background-color: #fff;
    white-space: nowrap;
    margin-right: 1rem;
}

#catSide .acd.sideTitle {
     color: #FFF;
     background: rgba(1, 49, 97, 0.5);
     line-height: 1.5; 
     font-size: 2rem;
     padding: 2rem;
     font-weight: normal;
     border: none;
}
#search-clear { margin: 0 auto; }


@media screen and (max-width:1023.9px) {
    #kw_search > ul > li.sideDd.keyword.acd-content {
        width: calc(100% - 75px);
    }
    #kw_search > ul > li:nth-child(2) {
        width: 75px;
        text-align: right;
    }
    #search-start { margin: 0 1em 0 auto; }
}

/*20221018 モーダルポップアップ*/


/*=====POPUP=====*/
.modal-popup {
  display: none;
  position: fixed;
  left: 20px;
  bottom: 20px;
  width: 600px;
  z-index: 1;
}
.modal-popup--close {
  position: absolute;
  top: 20px;
  right: 20px;
  width: 30px;
  height: 30px;
  text-indent: -9999px;
  white-space: nowrap;
  overflow: hidden;
  cursor: pointer;
}
.modal-popup--close:before,
.modal-popup--close:after {
  content: '';
  position: absolute;
  top: 0;
  right: 0;
  left: 0;
  bottom: 0;
  margin: auto;
  width: 2px;
  height: 30px;
  background: #ccc;
  transform: rotate(45deg);
}
.modal-popup--close:after {
  transform: rotate(-45deg);
}

@media screen and (max-width:768px){
  /*=====POPUP=====*/
  .modal-popup {
    width: 250px;
    left: 10px;
    bottom: 10px;
  }
  .modal-popup--close {
    top: 10px;
    right: 10px;
  }
}



/* 20221101 FAQ新設 */

/*タブ関連*/
/* 221110 この仕様無効 (;_;)
.tab-wrap {
    width: 100%;
    max-width: 60vw;
  display: flex;
  flex-wrap: wrap;
  margin:20px auto;
}
.tab-wrap:after {
  content: '';
  width: 100%;
  height: 3px;
  background: #15375f;
  display: block;
  order: -1;
}
.tab-label {
  color: #fff;
background: rgb(153,153,153);
background: linear-gradient(162deg, rgba(153,153,153,1) 35%, rgba(85,85,85,1) 100%, rgba(153,153,153,1) 1100%);
    font-weight: bold;
    font-size: 2.2rem;
  text-shadow: 0 -1px 0 rgba(0,0,0,.2);
  white-space: nowrap;
  text-align: center;
  padding: 10px .5em;
  order: -1;
  position: relative;
  z-index: 1;
  cursor: pointer;
  border-radius: 5px 5px 0 0;
  flex: 1;
}

.tab-content {
  width: 100%;
  height: 0;
  overflow: hidden;
  opacity: 0;
}
/* アクティブなタブ *//*
.tab-switch:checked+.tab-label {
  background: #15375f;
}
.tab-switch:checked+.tab-label+.tab-content {
  height: auto;
  overflow: auto;
  padding: 6rem 4rem;
  opacity: 1;
  transition: .5s opacity;
    border-right: #15375f solid 1px;
    border-bottom: #15375f solid 1px;
    border-left: #15375f solid 1px;
}
/* ラジオボタン非表示 *//*
.tab-switch {
  display: none !important;
}

#answer0001 > div.faq_q:before,
#answer0001 > div.faq_a:before { display: none; }

/*中身*//*

div.faq_q h5 {
    font-size: 2.2rem;
    color: #15375f;
    text-align: left;
    margin: 0 0 1em 0 !important;
}

div.faq_a p {
    font-size: 2.0rem;
    font-weight: 500;
    color: #666;
    text-align: left;
    line-height: 1.5;
}

.tab-content article {
    margin-bottom: 5rem;
}

div.faq_q, div.faq_a {
    margin-left: 28px;
    position: relative;
}
div.faq_q:before {
    content: 'Q.';
    font-weight: normal;
}
div.faq_a:before {
    content: 'A.';
    color: #666;
    margin-top: 3px;
}
div.faq_q:before, div.faq_a:before {
    font-family: "Times New Roman", Times, serif;
    font-size: 22px;
    position: absolute;
    top: -6px;
    left: -28px;
}

body > main > div.wpPage > main#faq {
    padding-top: 2rem;
}
div.faq_q:before {
    content: 'Q.';
    font-weight: normal;
}
div.faq_a:before {
    content: 'A.';
    color: #666;
    margin-top: 3px;
}


/*20221108*/

#answer0001,
#answer0001 > div.faq_a {
    text-align: center;
    margin: 50px auto 0;
}


@media screen and (max-width:428px) { 
.tab-wrap {
    width: 100%;
    max-width: 90vw;
  display: flex;
  flex-wrap: wrap;
  margin:20px auto;
}
    #answer0000 > div.faq_start > img {
        width: 80vw;
        margin: 0 auto;
    }
#faq > div > label { width: 100% !important; }
}



/*FAQリンク切り替え版*/
/*はじめにページ*/
#before_faq { padding-top: 0; }

#before_faq a { color: #fff !important; text-decoration: none !important; }

#faq-wrap {
    display: flex;
    flex-direction: row;
    width: 100%;
    max-width: 500px;
    margin: 30px auto;
    padding: 0 !important;
    justify-content: center;
}

.faq_container1 {
    display: flex;
    flex-direction: column;
    width: 100%;
    justify-content: space-between;
    gap: 20px;
}
.faq_container1 li:hover {
    opacity: 0.9;
}
.faq_item1 {
    background-color: #15375f;
    padding: 1.2em 2em;
    border-radius: 10px;
}
.faq_item1 a {
    color: #fff;
    font-weight: 600;
    text-decoration: none;
}


@media screen and (max-width:428px) { 
.faq_item1 {
    background-color: #15375f;
    padding: 0.8em;
    border-radius: 10px;
}
}

/*それぞれのFAQページ*/

#faq-wrap2 {
    width: 80vw;
    max-width: 1000px;
    margin: 50px auto 30px;
}

#faq-wrap2 ul.faq-menu {
    display: flex;
    justify-content: flex-end;
    list-style: none !important;
    margin: 0;
    padding: 0 !important;
}
#faq-wrap2 ul.faq-menu li.off {
    padding: 0.5em;
    border-radius: 5px 5px 0 0;
    width: 100%;
}
#faq-wrap2 ul.faq-menu li.ontab {
    background-color: #15375f;
    color: #fff;
    padding: 0.5em;
    border-radius: 5px 5px 0 0;
    width: 100%;
}

#faq-wrap2 ul.faq-menu li {
    border: 1px solid #15375f;
    border-bottom: none;
    border-left: none;
}
#faq-wrap2 ul.faq-menu li:first-child {
    border-left: 1px solid #15375f;
}
#faq-wrap2 ul.faq-menu a {
    text-decoration: none !important;
}

#faq-wrap2 section {
    border: solid 1px #15375f;
    margin: 0 auto;
    padding: 6em 3em;
    line-height: 1.5;
}

#faq-wrap2 h5 {
    font-size: 2.2rem;
    color: #15375f;
    text-align: left;
    margin: 0 0 1em 2em !important;
}

article div.faq_a p {
    font-size: 2.0rem;
    font-weight: 500;
    color: #666;
    text-align: left;
    line-height: 1.5;
    margin: 0 0 2em 2em;
}


div.faq_q, div.faq_a {
    margin-left: 0;/*28px;*/
    position: relative;
    margin-bottom: 2em !important;
}
#faq-wrap2 > section > div.faq-content > article > div.faq_a {
    margin-bottom: 4em !important;
}


div.faq_q:before {
    content: 'Q.';
    font-weight: normal;
    margin-top: -3px !important;
}
div.faq_a:before {
    content: 'A.';
    color: #666;
    margin-top: -2px !important;
}
div.faq_q:before, div.faq_a:before {
    font-family: "Times New Roman", Times, serif;
    font-size: 22px;
    position: absolute;
    top: -6px;
    left: 0;/*-28px;*/
}

body > main > div.wpPage > main#faq {
    padding-top: 2rem;
}
div.faq_q:before {
    content: 'Q.';
    font-weight: normal;
}
div.faq_a:before {
    content: 'A.';
    color: #666;
    margin-top: 3px;
}

@media screen and (max-width:768px) {
    #faq-wrap2 ul.faq-menu{
        flex-direction: column;
    }
    #faq-wrap2 ul.faq-menu li {
        width: 100%;
        padding: 0.5em 1em !important;
    } 
}
@media screen and (max-width:428px) { 
#faq-wrap2 {
    width: 95vw;
    max-width: none;
    margin: 40px auto 30px;
    padding: 0 !important;
}
    
#faq-wrap2 section {
    padding: 4em 1em;
    line-height: 1.5;
    }
}


/*-------------------------------
 　　　　Form-Template 
---------------------------------*/


#YDM_Form01 {
    width: 100% !important;
    max-width: 1000px !important;
    margin: 0 auto !important;
    background: #FFF;
    border: none;
    font-size: 2.0rem;
    box-sizing: border-box;
}

#YDM_Form01 dl {
    width: 100%;
    max-width: 1000px;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    border: 1px solid #999;
    background: #E6EAEF;;
}

#YDM_Form01 > dl > dt {
    text-align: left;
    background: #E6EAEF;
    width: 20% !important;
    max-width: 200px !important;
    font-weight: 600;
    padding: 20px;
    height: 7rem;
    display: flex;
    align-items: center;
    border-bottom: 1px dotted #ccc;
}

#YDM_Form01 > dl > dd {
    text-align: left;
    background: #fff;
    width: 80% !important;
    max-width: 800px !important;
    padding: 10px;
    border-bottom: 1px dotted #ccc;
    height: 7rem;
}

#YDM_Form01 > dl > dd > input {
    width: 100%;
    text-align: left;
}

#YDM_Form01 .FT01_textarea {
    height: 28rem !important;
}

#YDM_Form01 .FT01_file {
    height: 12rem !important;
}


@media screen and (max-width:768px) {

    #YDM_Form01 {
        width: 100% !important;
        margin: 0 !important;
        padding: 0 !important;
    }

    #YDM_Form01 dl {
        flex-direction: column;
    }
    
    #YDM_Form01 > dl > dt {
        width: 100% !important;
        max-width: none !important;
        padding: 10px 15px !important;
        height: auto !important;
    }

    #YDM_Form01 > dl > dt.FT01_textarea {
        width: 100% !important;
        max-width: none !important;
        padding: 10px 15px !important;
        height: 7rem !important;
    }

    #YDM_Form01 > dl > dd.FT01_textarea {
        width: 100% !important;
        max-width: none !important;
        padding: 10px 15px !important;
        height: 20rem !important;
    }

    #YDM_Form01 > dl > dt.FT01_file {
        width: 100% !important;
        max-width: none !important;
        padding: 10px 15px !important;
        height: 7rem !important;
    }

    #YDM_Form01 > dl > dd.FT01_file {
        width: 100% !important;
        max-width: none !important;
        padding: 10px 15px !important;
        height: 15rem !important;
    }

    #YDM_Form01 > dl > dd {
        width: 100% !important;
        max-width: none !important;
    }
 }

/* 20221213 ドアリース注文ページ（固定ページ）フォーム部分調整 */

#dw-order {
    width: 100%;
    max-width: 800px;
    margin: 0 auto !important;
    padding: 0;
}
#dw-order table.tbl-r05  {
        border: 0;
        width: 100%;
    margin-bottom: 30px;
    }    
#item_form > table > tbody > tr > td,
#item_form > table > tbody > tr > th {
    font-size: 14px !important;
}
table.tbl-r05 th,table.tbl-r05 td {
    border-bottom: 1px solid #999;
    border-right: 1px solid #999;
    border-left: 1px solid #999;
    }
#dw-order table.tbl-r05 tr.last td,
#dw-order table.tbl-r05 tr.last th {
        border-bottom: none;
    }
    input.dw-price { width: 20vw; }
#item_form > table > tbody > tr > td:nth-child(2),
#item_form > table > tbody > tr > td:nth-child(3),
#item_form > table > tbody > tr > td:nth-child(4),
#item_form > table > tbody > tr > td:nth-child(2) {
    text-align: right;
}
#item_form > table > tbody > tr.thead > th {
    font-weight: bold;
    color: #fff;
    text-align: center;
    background: #749FC3;
}
body > main > div.wpPage > div.wreath_all {
    padding-bottom: 0;
}

#address_form > div.wpcf7c-elm-step1 > div.wreath_all > table > tbody > tr:nth-child(1) > td:nth-child(2) > span > input,
#address_form > div.wpcf7c-elm-step1 > div.wreath_all > table > tbody > tr:nth-child(3) > td:nth-child(2) > span.wpcf7-form-control-wrap.yuubin > input,
#address_form > div.wpcf7c-elm-step1 > div.wreath_all > div.wreath_all > table > tbody > tr:nth-child(2) > td > span.wpcf7-form-control-wrap.yuubin-o > input{
    width: 150px;
}

#address_form > div.wpcf7c-elm-step1 > div.wreath_all > table > tbody > tr:nth-child(4) > td:nth-child(2) > span > input,
#address_form > div.wpcf7c-elm-step1 > div.wreath_all > table > tbody > tr:nth-child(5) > td > span > input,
#address_form > div.wpcf7c-elm-step1 > div.wreath_all > div.wreath_all > table > tbody > tr:nth-child(3) > td:nth-child(2) > span > input {
    width: 300px;
}

#address_form input,
#address_form textarea {
    margin-left: 1.5em;
    width: calc(100% - 1.5em);
}
#address_form > div.wpcf7c-elm-step1 > div.wreath_all > table > tbody > tr:nth-child(3) > td:nth-child(2) > span.wpcf7-form-control-wrap.yuubin > input,
#address_form > div.wpcf7c-elm-step1 > div.wreath_all > div.wreath_all > table > tbody > tr:nth-child(2) > td > span.wpcf7-form-control-wrap.yuubin-o > input {
    margin-left: 0.7em;
}
#address_form > div.wpcf7c-elm-step1 > p { text-align: center; }
#address_form > div.wpcf7c-elm-step1 > p > input {
    width: 200px;
    margin: 30px auto;
    padding: 1em;
    background: #013161;
    font-weight: bold;
    color: #fff;
    text-align: center;
}

@media screen and (max-width:1024px) {
#dw-order {
    width: 90%;
    max-width: none;
    margin: 0 auto !important;
    padding: 0 10px;
}

.tbl-r05 td:first-child {
 background: #fff;
}

#item_form > table > tbody > tr.thead { 
    border-top: 1px solid #999;
    background: #749FC3;
}
input.dw-price { width: 20vw; }


  .tbl-r05 {
    width: 100%;
  }
  .tbl-r05 .thead {
    display: none;
  }
  .tbl-r05 tr {
    width: 100%;
  }
  .tbl-r05 td {
    /*display: block;*/
    display: flex;
    justify-content: space-between; /*左右*/
    align-items: center;     /*上下中央揃え*/
    text-align: right;
    width: 100%;
  }
  .tbl-r05 td:first-child {
    background: #749FC3;
    color: #fff;
    font-weight: bold;
  }
    
  .tbl-r05 td:before {
    content: attr(data-label);
    float: left;
    font-weight: bold;
    margin-right: 10px;
  }
    #dw-order > table:nth-child(1) > tbody > tr > td:nth-child(4) > input[type=text] {
        margin-left: auto;
        margin-right: 5px;
    }
    #dw-order > table:nth-child(1) > tbody > tr > td:nth-child(1)::before {
        white-space: nowrap;
    }
        table.tbl-r05 > tbody > tr > td:nth-child(4) > input[type=text],
    table.tbl-r05 > tbody > tr > td:nth-child(4) > input[type=text] {
        margin-left: auto;
        margin-right: 5px;
        text-align: right;
    }
    #dw-order > table.tbl-r05 > tbody > tr > td:nth-child(1)::before {
        white-space: nowrap;
    }
    table.tbl-r05 > tbody > tr > td:nth-child(2) > input[type=text],
    table.tbl-r05 > tbody > tr > td:nth-child(2) > input[type=text] {
        margin-left: auto;
        margin-right: 5px;
        text-align: right;
    }
    #item_form > table > tbody > tr:nth-child(2) > td { white-space: nowrap; }
    input.dw-price { width: 50vw; }
}


@media screen and (max-width:430px) {
#address_form input,
#address_form > div.wpcf7c-elm-step1 > div.wreath_all > table > tbody > tr:nth-child(4) > td:nth-child(2) > span > input,
#address_form > div.wpcf7c-elm-step1 > div.wreath_all > div.wreath_all > table > tbody > tr:nth-child(3) > td:nth-child(2) > span > input,
#address_form > div.wpcf7c-elm-step1 > div.wreath_all > table > tbody > tr:nth-child(5) > td > span > input,
#address_form > div.wpcf7c-elm-step1 > div.wreath_all > table > tbody > tr:nth-child(6) > td:nth-child(2) > span > textarea { width: 100%; margin: 0 auto;}
}



/*　20221222　FAQ改装　*/

/*====================================================================
.s_07 .accordion_one
====================================================================*/
.s_07 .accordion_one {
/*  max-width: 700px;    */
  margin: 0 auto;
}

/*中分類のmargin
.s_07 .secondarC { 
    margin-top: 2em;
    margin-bottom: 2em; 
}
*/

.s_07 .accordion_one .accordion_header {
  background-color: #15375f;
  border-bottom: 1px solid #fff;
  color: #fff;
  font-size: 2.4rem;
  font-weight: bold;
  padding: 20px 11%;
  text-align: left;
  position: relative;
  z-index: +1;
  cursor: pointer;
  transition-duration: 0.2s;
    margin-bottom: 0;
}
.s_07 .accordion_one .accordion_inner .accordion_header {
    background-color: #2D609E;
    font-weight: 400;
}
.s_07 .accordion_one .accordion_inner .accordion_inner  .accordion_header {
    background-color: #DDE4ED;
    color: #222;
    font-weight: 400;
}
#about_items > div > div > div > div.accordion_inner > div > div,
#about_others> div > div > div > div.accordion_inner > div > div{
    background-color: #DDE4ED;
    color: #222;
    font-weight: 400;
}
.s_07 .accordion_one .accordion_header:hover {
  opacity: .8;
}
.s_07 .accordion_one .accordion_header .i_box {
  display: flex;
  justify-content: center;
  align-items: center;
  position: absolute;
  top: 50%;
  right: 5%;
  width: 40px;
  height: 40px;
  border: 1px solid #fff;
  margin-top: -20px;
  box-sizing: border-box;
  -webkit-transform: rotate(45deg);
  transform: rotate(45deg);
  transform-origin: center center;
  transition-duration: 0.2s;
}
.s_07 .accordion_one .accordion_header .i_box .one_i {
  display: block;
  width: 18px;
  height: 18px;
  -webkit-transform: rotate(45deg);
  transform: rotate(45deg);
  transform-origin: center center;
  transition-duration: 0.2s;
  position: relative;
}
.s_07 .accordion_one .accordion_header.open .i_box {
  -webkit-transform: rotate(-360deg);
  transform: rotate(-360deg);
}
.s_07 .accordion_one .accordion_header .i_box .one_i:before, .s_07 .accordion_one .accordion_header .i_box .one_i:after {
  display: flex;
  content: '';
  background-color: #fff;
  border-radius: 10px;
  width: 18px;
  height: 4px;
  position: absolute;
  top: 7px;
  left: 0;
  -webkit-transform: rotate(0deg);
  transform: rotate(0deg);
  transform-origin: center center;
}
.s_07 .accordion_one .accordion_header .i_box .one_i:before {
  width: 4px;
  height: 18px;
  top: 0;
  left: 7px;
}
.s_07 .accordion_one .accordion_header.open .i_box .one_i:before {
  content: none;
}
.s_07 .accordion_one .accordion_header.open .i_box .one_i:after {
  -webkit-transform: rotate(-45deg);
  transform: rotate(-45deg);
}
.s_07 .accordion_one .accordion_inner {
  display: none;
  padding: 0;
  box-sizing: border-box;
}
.s_07 .accordion_one .accordion_inner .box_one {
  height: 300px;
}
.s_07 .accordion_one .accordion_inner p.txt_a_ac {
  margin: 0;
}
@media screen and (max-width: 1024px) {
  .s_07 .accordion_one .accordion_header {
    font-size: 18px;
  }
  .s_07 .accordion_one .accordion_header .i_box {
    width: 30px;
    height: 30px;
    margin-top: -15px;
  }
}
@media screen and (max-width: 767px) {
  .s_07 .accordion_one .accordion_header {
    font-size: 16px;
    text-align: left;
    padding: 15px 60px 15px 15px;
  }
}



/* 固定ページtemplate　最大幅設定　20221222 */

.wpPage h1,
.wpPage h2,
.wpPage h3,
.wpPage h4,
.wpPage h5,
.wpPage h6,
.wpPage .mainVisualB,
.wpPage .mainVisualD,
.wpPage .mainVisualE,
.wpPage .mainVisualF,
.wpPage .mainVisualG,
.wpPage .textGroupAL,
.wpPage .textGroupAC,
.wpPage .textGroupAR,
.wpPage .textGroupFR,
.wpPage .textGroupFL,
.wpPage .text__inner,
.wpPage .imgTextGroupL2,
.wpPage .imgTextGroupM2,
.wpPage .imgTextGroupM2-2,
.wpPage .imgTextGroupM3,
.wpPage .imgTextGroupM5,
.wpPage .imgTextGroupS2,
.wpPage .imgTextGroupTR,
.wpPage .imgTextGroupFR,
.wpPage .imgTextGroupFL,
.wpPage .imgTextGroupL,
.wpPage .imgTextGroupM,
.wpPage .imgTextGroupS,
.wpPage .imgTextGroupF,
.wpPage .recommendSlide,
.wpPage .imgTile4,
.wpPage .imgTile9,
.wpPage .imgTile16,
.wpPage .imgTileL,
.wpPage .imgTileR,
.wpPage .TextGroupimgL{
    max-width: 1200px !important;
    margin: 0 auto !important;
}
div.wpPage h1,
div.wpPage h2,
div.wpPage h3,
div.wpPage h4,
div.wpPage h5,
div.wpPage h6 {
    margin-bottom: 20px !important;
}
.wpPage { line-height: 1.6; }

@media screen and (max-width: 1024px) {
.wpPage .mainVisualE,
.wpPage .mainVisualF,
.wpPage .mainVisualG,
.wpPage .textGroupAL,
.wpPage .textGroupAC,
.wpPage .textGroupAR,
.wpPage .textGroupFR,
.wpPage .textGroupFL,
.wpPage .text__inner,
.wpPage .imgTextGroupL2,
.wpPage .imgTextGroupM2,
.wpPage .imgTextGroupM2-2,
.wpPage .imgTextGroupM3,
.wpPage .imgTextGroupS2,
.wpPage .imgTextGroupTR,
.wpPage .imgTextGroupFR,
.wpPage .imgTextGroupFL,
.wpPage .imgTextGroupL,
.wpPage .imgTextGroupM,
.wpPage .imgTextGroupS,
.wpPage .imgTextGroupF,
.wpPage .recommendSlide,
.wpPage .imgTile4,
.wpPage .imgTile9,
.wpPage .imgTile16,
.wpPage .imgTileL,
.wpPage .imgTileR {
    width: 90vw;
    margin: 0 auto 50px !important;
    padding: 0 !important;
}
.wpPage .imgTextGroupL2 img,
.wpPage .imgTextGroupM2 img,
.wpPage .imgTextGroupM2-2 img,
.wpPage .imgTextGroupM3 img,
.wpPage .imgTextGroupS2 img,
.wpPage .imgTextGroupTR img,
.wpPage .imgTextGroupFR img,
.wpPage .imgTextGroupFL img,
.wpPage .imgTextGroupL img,
.wpPage .imgTextGroupM img,
.wpPage .imgTextGroupS img,
.wpPage .imgTextGroupF img,
div.wpPage div.recommendSlide.wpSlide img {
    margin-bottom: 20px;
    }
    
.wpPage .mainVisualA,
.wpPage .mainVisualB,
.wpPage .mainVisualC,
.wpPage .mainVisualD,
div.wpPage div div.menuGroupA,
div.wpPage div div.menuGroupB,
div.wpPage div div.menuGroupC,
div.wpPage div div.menuGroupD,
div.wpPage div div.menuGroupE,
div.wpPage div div.menuGroupF,
div.wpPage div div.menuGroupG,
div.wpPage div div.listGroup1,
div.wpPage div div.listGroup2,
div.wpPage div div.listGroup3{
    margin-bottom: 50px !important;
    }
    
.wpPage h1,
.wpPage h2,
.wpPage h3,
.wpPage h4,
.wpPage h5,
.wpPage h6
    { margin: 0 auto 20px !important; }
    
    .wpPage .imgTextGroupCM img {
        margin-bottom: 20px;
    }
.wpPage { line-height: 1.6; }
}

/* 20230314 海外向けページ　背景 */

body.incbg {
    background-image: url(/ydmwp/wp-content/uploads/2023/03/poppyincTOP.jpg);
    background-repeat: no-repeat;
    background-size: contain;
    background-position: center 30px;
    height: auto;
}

div#inctitle {
    margin: 13% 0 18%;
    padding: 20px;
}

div#inctitle img{
    margin: 20px 0 0;
}

div.clear {
    background-color: rgba(255,255,255,0.75);
}

div.column{
    display: flex;
    justify-content: center;
}

div.column div.columnA{
    width: 65%;
    padding: 2.5rem;
}

div.column div.columnB{
    width: 15%;
    padding: 2.5rem;
}

table.simpletable{
    border-collapse: separate;
    border-spacing: 0px 40px; 
    border-style:none; 
    table-layout:   auto;
}

table.simpletable p{
    font-size: 1.8rem;
}

@media screen and (max-width: 1024px) {

body.incbg {
    background-image: url(/ydmwp/wp-content/uploads/2023/03/poppyincTOP.jpg);
    background-position: center 50px;
    height: auto;
    }    

div#inctitle {
    margin: 20% 0 8% ;
    padding: 0px;
}

div#inctitle img{
    margin: 10px 0 0;
    width: 80%;
    height: auto;
}
 
div.column div.columnA,
div.column div.columnB{
    padding: 1.5rem;    
}

div.column div.columnA{
    width: 66%;
}

div.column div.columnB{
    width: 28%;
}

table.simpletable{
    border-collapse: separate;
    border-spacing: 0px 15px; 
}

}

/* 20230417 主要取扱店一覧 */

table.shoptable{
    border-collapse: separate;
    border-spacing: 0px 40px; 
    border-style:none; 
    table-layout:   auto;
}

table.shoptable th{
    border: none;
    background-color: #f0f0f5;
    width: 15%;
    text-align: center;
    font-weight: bold;
    font-size: 2rem;
}

table.shoptable td.name{
    border: none;
    width: 35%;
    font-weight: bold;
    font-size: 2rem;
}

table.shoptable td.tel{
    width: 20%;
    font-size: 1.8rem;
}

table.shoptable td.add{
    width: 30%;
    font-size: 1.8rem;
}


@media screen and (max-width: 1024px) {

    table.shoptable{
        border-collapse: separate;
        border-spacing: 0px 15px; 
    }

    table.shoptable th{
        padding: 5px 0;
        text-align: left;
    }
    
    table.shoptable td{
        padding: 5px 0;
    }
    
    table.shoptable th{
        width: 100%;
    }

    table.shoptable td.name{
        width: 100%;
        font-size: 1.8rem;
    }
    
    table.shoptable td.tel{
        width: 100%;
        font-size: 1.8rem;
    }
    
    table.shoptable td.add{
        width: 100%;
        font-size: 1.8rem;
    }

    }

    /* 20230426 ジャイアントフラワー背景 */

body.giantbg {
    background-image: url(/ydmwp/wp-content/uploads/2023/04/giantflower_back.jpg);
    background-repeat: no-repeat;
    background-attachment: fixed;
    background-size: contain;
    background-position: center 30px;
    background-color  : #fef9fb;
    background-blend-mode : multiply;
    height: auto;
}

@media screen and (max-width: 1024px) {

    body.giantbg {
        background-image: url(/ydmwp/wp-content/uploads/2023/04/giantflower_back.jpg);
        background-position: center 75px;
        height: auto;
        } 
    }

    /* 20230619 画像横並び */

    div.snsicon{
        max-width: 500px;
        margin:0 auto
    }

    div.snsicon ul{
        display: flex;
        justify-content: center;
    }

    div.snsicon li {
        list-style: none;
        margin:5%;
      }

    div.TextGroupimgL{
        width: 100%;
        display: flex;
        justify-content: center;
        align-items: center;
        padding: 10px;
    }

    div.TextGroupimgL div.item{
        width: 10%;
        max-width: 100px;
        min-width: 25px;
        margin: 10px !important;
    }

    div.TextGroupimgL div.txt{
        width: 80%;
    }

    @media screen and (max-width: 1024px) {

        div.snsicon{
            max-width: 250px;
            margin:0 auto
        }
    }

/* 20230719 2023クリスマス特集背景 */

body.christmasbg {
    background-image: url(/ydmwp/wp-content/uploads/2023/07/2023christmas_bg_PC.jpg);
    background-repeat: no-repeat;
    background-attachment: fixed;
    background-size: contain;
    background-position: center 30px;
    height: auto;
}

@media screen and (max-width: 1024px) {

    body.christmasbg {
        background-image: url(/ydmwp/wp-content/uploads/2023/07/2023christmas_bg_SP.jpg);
        background-position: center 75px;
        height: auto;
        } 
    }

/* 20230906 游明朝見出し・本文行間広め */

.wpPage h1.yumincho,
.wpPage h2.yumincho,
.wpPage h3.yumincho,
.wpPage h4.yumincho,
.wpPage h5.yumincho,
.wpPage h6.yumincho
    { 
      font-family: '游明朝', 'Yu Mincho', serif;
      letter-spacing: 0.05em  
    }

    .wpPage p.linelarge
    {
        line-height: 2.5;
    }

 /* 20230906 パソコンで見たときは"pc"のclassがついた画像が表示される */
 .wpPage img.pc { display: block !important; margin: 0 auto;}
 .wpPage img.sp { display: none !important; margin: 0 auto;}
 
/* 20230906 スマートフォンで見たときは"sp"のclassがついた画像が表示される */
@media only screen and (max-width: 750px) {
    .wpPage img.pc  { display: none !important; margin: 0 auto;}
    .wpPage img.sp  { display: block !important; margin: 0 auto; max-width: 100%;}
}

/* 20230719 2023正月特集背景 */

body.newyearbg {
    background-image: url(/ydmwp/wp-content/uploads/2023/09/2024_newyear_special_bg.jpg);
    background-position: center center;
    background-repeat: no-repeat;
    background-attachment: fixed; 
    background-size: cover;  
    background-color: #f7f6f5;
}

@media screen and (max-width: 1024px) {

    body.newyearbg {
        background-position: center 75px;
        } 
    }

/* 20231214 2024春特集背景 */

body.springbg {
    background-image: url(/ydmwp/wp-content/uploads/2023/12/2024spring_bg_PC.jpg);
    background-repeat: no-repeat;
    background-attachment: fixed;
    background-size: contain;
    background-position: center bottom 30px;
    height: auto;
}

@media screen and (max-width: 1024px) {

    body.springbg {
        background-image: url(/ydmwp/wp-content/uploads/2023/12/2024spring_bg_SP.jpg);
        background-position: center bottom 75px;
        height: auto;
        } 
    }

/* 20240220 ジャイアントフラワーチョコレート背景 */

body.giantchocobg {
    background-image: url(/ydmwp/wp-content/uploads/2024/02/bg-choco-melty.jpg);
    background-repeat: no-repeat;
    background-attachment: fixed;
    background-size: contain;
    background-position: center 30px;
    height: auto;
}

@media screen and (max-width: 1024px) {

    body.giantchocobg {
        background-image: url(/ydmwp/wp-content/uploads/2024/02/bg-choco-melty.jpg);
        background-position: center 75px;
        height: auto;
        } 
    }

/* 20241028 ビッグプレゼントボックス背景 */

body.bigboxbg {
    background-image: url(/ydmwp/wp-content/uploads/2024/10/big-box_bg-2.jpg);
    background-repeat: no-repeat;
    background-attachment: fixed;
    background-size: cover;
    height: auto;
}

@media screen and (max-width: 1024px) {

    body.bigboxbg {
        background-image: url(/ydmwp/wp-content/uploads/2024/10/big-box_bg-2.jpg);
        height: auto;
        } 
    }