/*
Theme Name: type-TN26
Author: TN
Version: 2.6, 2026.02
*/

@charset "UTF-8";

/*------------------------------------------------------------
	header - nav
------------------------------------------------------------ */
header { position: absolute; width:100%; padding:0; background: rgba(255,255,255,1); top:0; z-index: 9999;}
header .headersakaeinbox { width:96%; height:100px; margin: 0 auto; padding:0; display:flex; align-items:center; }
header h1, header p { position: relative; line-height:1.4; font-size:1.2vw; text-align: center; margin: 0 auto 0 0; text-align: left; display: flex; align-items: center; color: var(--pp2); font-weight: 400;}
header h1 a, header p a { display:block; margin-right: 1em;}
header h1 img, header p img { width: 26vw; max-width: 200px; margin: 0;}

#mobile-head { margin-right:auto; align-items:center;}
header nav { background: var(--bl2); height: 56px; display: flex; align-items: center; justify-content: center; padding: 0 1.5em;}
header nav ul { display: flex; align-items: center;}
header nav li { position: relative; padding:.1em .9em; margin: 0em; text-decoration:none; font-size:1vw; border-left: 1px solid #fff;}
header nav li:last-child,
header nav li:nth-last-of-type(2) { border-right: 1px solid #fff;}
header nav li a { position:relative; display:block; text-decoration:none; font-size:1.3vw; text-align:center; line-height:1.2; color: #fff; font-weight: 500; height: 18px; display: flex; align-items: center;}

header .headersakaeinbox > div { display: flex; align-items: stretch; justify-content: flex-end;}
header .headersakaeinbox > div a { display: flex; align-items: center; justify-content: center; width: 17vw; border-left: 1px solid #fff; padding: 12px 8px;}
header .headersakaeinbox > div a:nth-of-type(1) { background: var(--line);}
header .headersakaeinbox > div a:nth-of-type(2) { background: var(--tel);}
header .headersakaeinbox > div a:nth-of-type(3) { background: var(--pp1);}
header .headersakaeinbox > div a h6, header .headersakaeinbox > div a i { color: #fff; line-height: 1;}
header .headersakaeinbox > div a i { font-size: 3.2vw; margin: 0 5% 0 0;}
header .headersakaeinbox > div a:nth-of-type(3) i { font-size: 3vw; margin: 0 5% 0 0;}
header .headersakaeinbox > div a img { width: 18%; margin: 0 10px 0 0;}
header .headersakaeinbox > div a h6 { font-size: 1.4vw;}
header .headersakaeinbox > div a:nth-of-type(2) h6 { font-size: 1.55vw;}
header .headersakaeinbox > div a h6 span { font-size: 1.1vw; display: block; margin-top: .4em;}
header .headersakaeinbox > div a h6 span span { display: none; margin-top: 0;}
header .headersakaeinbox > div a:hover { opacity: .7;}
header .headersakaeinbox > div a:hover img { opacity: 1;}

/* FIXED */
header.fixed { position: fixed !important; top:0; bottom:inherit !important; width:100%; background: rgba(255,255,255,.8); -webkit-backdrop-filter: saturate(180%) blur(20px); backdrop-filter: saturate(180%) blur(20px);}
header.fixed nav { height: 60px;}
header li:first-child,
header li:last-child { display: none;}
header.fixed nav li:first-child,
header.fixed nav li:last-child { display: block;}
header.fixed nav li:nth-last-of-type(2) { border-right: 0;}
header.fixed nav li:first-child img { width: 7vw; max-width: 80px;}
header.fixed nav li:last-child img { width: 2.5vw; max-width: 26px;}
@media(min-width:768px) {
    header.fixed .headersakaeinbox { display: none;}
    header.fixed h1 span, header.fixed p span { display: none;}
}

/*hover*/
header nav a:hover { color: #fff; opacity: .6;}
header nav a:before,
header nav a:after{
  position: absolute;
  bottom: -8px;
  content: "";
  display: inline-block;
  width: 0;
  height: 1px;
  background: #fff;
  transition:all .25s ease;
}
header nav a:before{ left: 50%; }
header nav a:after{ right: 50%; }
header nav a:hover:before,
header nav a:hover:after{ width: 50%; }

/* Toggle Button */
#nav-toggle { display: none; position: relative; width:30px; height:24px; cursor: pointer; z-index: 999; margin-left:auto; }
#nav-toggle div { position: relative; }
#nav-toggle span { display: block; position: absolute; height:2px; width: 100%; background: var(--bl1); left: 0; transition: .35s ease-in-out; border-radius: 20px; }
#nav-toggle span:nth-child(1) { top: 0; }
#nav-toggle span:nth-child(2) { top: 11px; }
#nav-toggle span:nth-child(3) { top: 22px; }

.namemenu { width: 90%; margin: 0 auto 1.5em; text-align: center; font-size: 2.6vw; color: #999;}

@media(min-width:1250px) {
    header h1, header p { font-size:13px;}
    header nav li span, header nav a { font-size:15px!important; }
    header .headersakaeinbox > div a { width: 220px;}
    header .headersakaeinbox > div a i { font-size: 36px;}
    header .headersakaeinbox > div a:nth-of-type(3) i { font-size: 32px;}
    header .headersakaeinbox > div a img { width: 18%;}
    header .headersakaeinbox > div a h6 { font-size: 18px;}
    header .headersakaeinbox > div a:nth-of-type(2) h6 { font-size: 20px;}
    header .headersakaeinbox > div a h6 span { font-size: 12px;}
    header .headersakaeinbox > div a h6 span span { display: inline;}
}

@media(max-width:767px) {
header { width: 100%; position: fixed; display: flex; align-items: center; padding: 0 4%; border-bottom: 1px solid var(--bl1);}
header .headersakaeinbox { width: 90%; margin: 0 auto 0 0; padding: 0; height:70px; }
header h1, header p { margin:0; width:100%;}
header h1 a, header p a { width:40%; margin-right: 4%;}
header h1 span, header p span { font-size: 2.2vw; line-height: 1.5; width: 56%;}
header h1 img, header p img { width:100%;}
header .headersakaeinbox > div { display: none;}

header .btn { padding: .8em 1.5em; margin: 4% auto; border: 0; text-align: center; width: 80%;}
header .btn i { color: #fff; padding-right: .5em;}

#mobile-head {
width: 10%;
margin:0;
padding:0;
position: relative;
display: flex;
flex-direction: row;
align-items: center;
z-index: 999;
}
header .logo {
position: absolute;
left: 0;
top: 10px;
}
header nav {
position: absolute;
/* 開いてないときは画面外に配置 */
top:70px;
left:-100vw;
width: 100%;
height:calc(100vh - 70px);
text-align: center;
padding:0;
-webkit-transition: .25s ease-in-out;
-moz-transition: .25s ease-in-out;
transition: .25s ease-in-out;
z-index: 998;
overflow:scroll;
-webkit-overflow-scrolling: touch;
align-items: flex-start;
display: block;
}
header nav ul {
list-style: none;
position: static;
right: 0;
bottom: 0;
font-size: 14px;
align-items: flex-start;
width:100%;
}
header nav > ul {
width: 100%;
padding:0;
margin-left: auto;
}

header nav ul li,
header.fixed nav li {
position: relative;
padding:0;
min-height:auto;
text-align:left;
font-size:4vw;
font-weight:normal;
display:block;
width:100%;
border-bottom:1px solid #d9edde;
border-left: 0;
}
header nav > ul > li:last-child,
header.fixed nav > ul > li:last-child { border: 0;}
header nav ul li a {
width: 100%;
display: block;
padding: .8em 1em;
text-align:left;
font-size:4vw;
font-weight:normal;
height: auto;
}

header nav ul li::after {
content: "\f105";
font-family: FontAwesome;
position: absolute;
top: 50%;
right: 3%;
transform: translate(-50%,-50%);
transition: all .2s ease-in-out;
color: #fff;
display:block;
}
header nav > ul > li:last-child::after { display: none;}

#nav-toggle, #post-menu {
display: block;
}
/* #nav-toggle 切り替えアニメーション */
header.open #nav-toggle span:nth-child(1) {
top: 11px;
-webkit-transform: rotate(315deg);
-moz-transform: rotate(315deg);
transform: rotate(315deg);
}
header.open #nav-toggle span:nth-child(2) {
width: 0;
left: 50%;
}
header.open #nav-toggle span:nth-child(3) {
top: 11px;
-webkit-transform: rotate(-315deg);
-moz-transform: rotate(-315deg);
transform: rotate(-315deg);
}
/* nav スライドアニメーション */
header.open nav {
/* nav top + #mobile-head height */
-moz-transform: translateX(100vw);
-webkit-transform: translateX(100vw);
transform: translateX(calc(100vw));
}

header nav ul { flex-direction:column;}
header nav li { margin-left:0;}
header nav a:before, header nav a:after, header nav a.on:before, header nav a.on:after { display:none; }

header nav > .tels { padding: 3% 5%; background: #fff; display: block; width: 100%;}

}

@media(max-width:320px) {
header nav > ul { width: 100%; }
header nav ul li a, header.fixed nav ul li a { font-size:1.4rem; }
}


/*------------------------------------------------------------
	COLORS
------------------------------------------------------------ */
:root {
    --bl0: #ff761b;
    --bl1: #f25b24;
    --bl2: #fbb03b;
    --bl3: #f9f8e4;
    --bl4: #f9f1d2;
    --pp1: #f25b24;
    --pp2: #ff904b;
    --gr1: #35aa97;
    --line: #00b901;
    --tel: #20add3;
    --red1: #F94B4B;
    --yl1: #fcff6c;
  }
  


/*------------------------------------------------------------
	COMMON
------------------------------------------------------------ */
body { background: var(--bl4) 0 0 repeat;}
main { display: block; margin-top: 156px;}
section { position:relative; width:100%; margin:0 auto; padding:0; box-sizing: border-box; }
section:not(:first-of-type) { margin-top: 7%;}
.wp-singular section:nth-child(-n+3),
.archive section:nth-child(-n+3) { margin-top: 0;}
section.bg { margin-top:7%; padding:7% 0; background:#fff; }
.sakaeWrapper { position: relative; width:90%; max-width:1100px; margin:0 auto; }
.sakaeWrapper.min { width:70%; }
.sakaeWrapper.mins { width:50%; }
.brd { padding-bottom:7%; border-bottom:1px solid #999; }
.sakaeWrapper:not(:first-of-type) { margin-top: 5%;}
.error404 section { padding-top: 7%;}

/* column */
.clmBox { position:relative; display:flex; flex-flow: row wrap; justify-content: space-between; box-sizing:border-box; }
.clmBox.normal { justify-content:flex-start; align-items:flex-start; }
.clmBox.center { justify-content:center; align-items:flex-start; }
.clmBox.cont-rev { justify-content:flex-end; align-items:flex-start; }
.clmBox.ali-rev { justify-content:flex-start; align-items:flex-end; }
.clmBox.all-rev { justify-content:flex-end; align-items:flex-end; }
.htmach { align-items:stretch; }
.clmBox li { display:block; padding:0; border:0; position:relative; }
.clmBox li.clmBox { display:flex; }
.clmBox img { width:100%; display:block; }
.clm2 li, .clm2 .clms { width:48%; margin-bottom: 5%;}
.clm3 li, .clm3 .clms { width:32%; margin-bottom: 5%;}
.clm4 li, .clm4 .clms { width:24%; }
.clm5 li, .clm5 .clms { width:19%; }
.clms { box-sizing:border-box; position:relative; }
.clm3::after{content:"";display: block;width:33%;}
.clm4::before{content:"";display: block;width:23%;order:1;}
.clm4::after{content:"";display: block;width:23%;}
.clm5 .empty{width:19%; margin:0;}
.clms { margin-bottom:2%; }
.clm2 li img, .clm3 li img, .clm4 li img, .clm5 li img, .clms img { width:100%; height:auto; }
.clmBox.center.clm3 li { width: 32%; margin: 0;}
.clmBox.center.clm3 li:nth-child(3n-2) { margin-right: 2%; }
.clmBox.center.clm3 li:nth-child(3n) { margin-left: 2%; }
.clmBox.center.clm3 li:nth-last-child(n+4),
.clmBox.center.clm3 li:nth-last-child(n+4) ~ li { margin-bottom: 2%; }
.imgauto img { width:auto !important; }
.clms a { width:100% !important; margin:0;}
.alignC { align-self:center; }
.alignC img { display:block; margin:auto; }
.clumn { display:flex !important; flex-direction:column; align-items: flex-start;}
.last-end-row { margin-right:auto; }
.last-end-clm { margin-top:auto; }
.clms.brd { border:2px solid #eef2f3; padding:2.5% 3%; }
.clms.brd.rad { border-radius:6px; }

@media(max-width:767px) {
    main { margin-top: 70px!important;}
    section:not(:first-of-type) { margin-top: 10%;}
    section.bg { margin-top:15%; padding:10% 0; }
    .sakaeWrapper { width:90%; margin:0 auto; }
    .sakaeWrapper.min { width:80%; }
    .sakaeWrapper.mins { width:80%; margin-bottom:10%; }
    .sakaeWrapper img { max-width:100%; }
    .brd { padding-bottom:15%;}
    .sakaeWrapper:not(:first-of-type) { margin-top: 10%;}

    .clm2 li, .clm2 .clms, .clm3 li, .clm3 .clms, .clm4 li, .clm4 .clms, .clm5 li, .clm5 .clms { width:100%; margin-bottom:0; }
    .clm5 .empty{ display:none;}
    .clms.brd { padding:5% 6%; }
    .clms.brd:first-child { margin-bottom:5%; }

    .textC { padding:0 1em; }
    .disbox { display:block; }
    .disbox .clms { width:100%; }
}
@media(max-width:320px) {
    .sakaeWrapper.min, .sakaeWrapper.mins { width:90%; }
}

section > h2, h2.titles { position: relative; text-align: center; font-family: 'Noto Serif JP', serif; color: var(--bl1); letter-spacing: 1px; margin-bottom: 1.2em; font-weight: 500;}
section > h2 span, h2.titles span { position: relative; display: block; margin-top: 2.8em; font-size: 22px; color: var(--bl0); font-family: 'Noto Sans JP', sans-serif; font-weight: 400; letter-spacing: 0; line-height: 1.5; font-weight: 400;}
section > h2 span::before, h2.titles span::before {
    content: "";
    display: block; width: 100%; height: 20px;
    position: absolute; top: -2em;
    background: url(images/common/title_line.svg) 50% 100% no-repeat;
}
section > h2 span.noSubtxt { margin-bottom: 5%;}

.sakaeWrapper h4 { color: var(--bl1); margin-bottom: .4em;}
.bg-w { background: rgba(255,255,255,.45); padding: 7% 0 6%;}
.sakaeWrapper.bg-w { background: rgba(255,255,255,.9); padding: 7% 0 6%;}
.bg-y { border: 1px solid #fff; background: #f9f1e8;}
@media(max-width:767px) {
    section > h2, h2.titles { letter-spacing: 3px; font-size: 6.2vw; line-height: 1.2; max-width: 90%; margin: 0 auto 1.4em;}
    section > h2 span, h2.titles span { margin-top: 2.6em; font-size: 3.4vw;}
    section > h2 span::before, h2.titles span::before { top: -2.3em; background-size: 25%;}
    .bg-w { padding: 10% 0;}
}

/*------------------------------------------------------------
	BUTTON
------------------------------------------------------------ */
button, [type="button"], [type="reset"], [type="submit"] { background:none; border:0; }
button:active { color:#fff; }
.btns { text-align: center!important; line-height: 1; font-weight: 500; margin: 5% auto 0;}
.btns a,
.btns input { position:relative; text-align:center; padding: .8em 3em 1em; line-height: 1; display:inline-block; border-radius: 50px; background: none; color: #fff; font-size: 2vw; background: var(--pp1); font-weight: 500;}
a.btns:hover, .btns a:hover, .btns input:hover { background: var(--pp2)!important;}

@media(min-width:1250px) {
    .btns a,
    .btns input { font-size: 20px;}
}
@media(max-width:767px) {
    section > .btns { width: 90%; margin-top: 8%;}
    .btns a { margin:0; padding: .9em 2em 1.2em; font-size: 3.6vw; min-width: 70%;}
    .btns input { padding: 1em; font-size: 4.5vw; min-width: 70%;}
}


/*------------------------------------------------------------
	MAIN
------------------------------------------------------------ */
.mainTop { position: relative; width: 100vw; background: url(images/top/main_bg.png) 50% 0 no-repeat; background-size: cover; border-bottom: 1px solid var(--bl2);}
.mainTop .cutin { position: relative; width: 95%; max-width: 1200px; height: auto; margin: 0 auto;}

.mainTop .cutin { display: flex; align-items: center; padding: 0;}
.mainTop .graphic01 { position: relative;; left: 0; bottom: 0; z-index: 6; margin: 0;}
.mainTop .graphic02 { position: absolute; right: 0; z-index: 7;}
.mainTop .graphic03 { position: absolute; left: -6px; bottom: 5%; z-index: 8; width: auto;}

section > h2 {  font-size: 3vw; text-align: center; }
section > p {font-size: 1.8vw; text-align: center; margin-top: 10px;}
section > h5 { text-align: center; margin-top: 10px;}

.event { padding: 4% 0;}
.event2 { padding: 0;}

@media(min-width:1280px) {
    section > h2 { font-size: 38px; }
    section > p { font-size: 18px; }
}

@media(max-width:1200px) {
    .mainTop .graphic01, .mainTop .graphic02 { width: 50%;}
}

@media(max-width:1500px) {
    .mainTop .graphic03 { max-width: 16%;}
}


@media(max-width:767px) {
    .cover { margin-top: 80px; height: auto;}
    .mainTop, .mainTop .cutin { height: auto;}
    section > h2 {  font-size: 1.8rem; }
    section > p {font-size: 1.4rem;}
    section > h5, section > p { width: 90%; margin: 10px auto 0;}
    .event img { max-width: 92%;}
    h2 > img { width: 85%!important;}
}


/*------------------------------------------------------------
	TOP
------------------------------------------------------------ */
/* MAIN slider*/
#sakaeKv { padding: 0;}
#sakaeKv h2 { margin: 0;}
#sakaeKv .swiper-slide { width:100vw; height: auto; position:relative; overflow: hidden; border-bottom: 1px solid var(--bl1);}
#sakaeKv .swiper-slide > div { width: 100%; height: 100%;}
#sakaeKv .swiper-slide.slide01 { background: url(images/top/main_slide1bg.jpg) 50% 0 no-repeat;background-size: cover;}
#sakaeKv .swiper-slide.slide01 > div { margin: 0 auto; padding: 0; width: 1172px; max-width: 84%; display: flex; align-items: flex-end;}
#sakaeKv .swiper-slide.slide01 > div > h2 img { margin: 0; width: 100%;}
#sakaeKv .swiper-slide.slide01 > img { position: absolute; left: 0; bottom: 0; width: 45%; max-width: 515px;}

.swiper-container { width: 100%; height: 100%;}
.swiper-button-prev.swiper-button-white,
.swiper-container-rtl .swiper-button-next.swiper-button-white,
.swiper-button-next.swiper-button-white,
.swiper-container-rtl .swiper-button-prev.swiper-button-white { background: none;}
.swiper-button-next, .swiper-button-prev { background:none; border: 1px solid var(--pp1); line-height: 1; border-radius: 50%; width: 40px; height: 40px; }
.swiper-button-next { right:30px; }
.swiper-button-prev { left:30px; }
.swiper-button-next:hover, .swiper-button-prev:hover { background:rgba(197,101,220,.3); }
.swiper-button-next::after, .swiper-button-prev::after {
content: "\f105";
font-family: FontAwesome;
position: absolute;
top: 46%;
right: 5px;
transform: translate(-50%, -50%);
transition: all .2s ease-in-out;
color: var(--pp1);
font-size: 210%;
}
.swiper-button-prev::after{
content:"\f104";
right: inherit;
left:17px;
}
.swiper-pagination { position: relative; bottom: inherit;}
.swiper-container-horizontal>.swiper-pagination-bullets, .swiper-pagination-custom, .swiper-pagination-fraction { position: relative; bottom: inherit; left: inherit;}
.swiper-pagination-bullet { width: 12px; height: 12px;}
.swiper-pagination-bullet-active { background: var(--bl1);}
.swiper-container-horizontal>.swiper-pagination-bullets .swiper-pagination-bullet { margin: 1em .6em;}
@media(max-width:767px) {
    /* MAIN */
    #sakaeKv .swiper-slide.slide01 > div { margin: 0; padding: 0; width: 100%; max-width: 100%; display: flex; align-items: flex-end;}
    #sakaeKv .swiper-slide.slide01 > div > h2 img { margin: 0; width: 100%;}
    #sakaeKv .swiper-slide.slide02 { background: none;}
    .swiper-button-next, .swiper-button-prev { width: 34px; height: 34px;}
    .swiper-button-next::after, .swiper-button-prev::after { font-size: 180%; right: 4px;}
    .swiper-button-prev::after{ left: 16px;}
    .swiper-button-next { right:20px;}
    .swiper-button-prev { left:20px;}
}


/* INFO */
#sakaeNews { margin-top: 4%; padding: 2% 0;}
#sakaeNews .sakaeWrapper { display: flex; align-items: center; margin: 0 auto;}
#sakaeNews h2 { font-size: 26px; border-right: 1px solid var(--bl0); padding-right: .8em; line-height: 1; color: var(--bl0); font-weight: 500;}
#sakaeNews ul { margin-left: 1.4em;}
#sakaeNews li { font-size: 18px; padding-right: 1em; color: var(--bl1);}
#sakaeNews li span { display: inline-block; padding-right: 1.5em; color: var(--bl2);}
#sakaeNews .btns { margin: 0 0 0 auto; width: auto; min-width: 200px; color: #fff; padding: .8em 1em; background: var(--pp1); border-radius: 50px;}
.evnBnr { margin: 4% 0 0;}
.evnBnr img { border: 2px solid #af770c; border-radius: 20px;}
.bnrImg { text-align: center; margin: 6% 0 0;}
.bnrImg img { margin: 0 auto; max-width: 90%;}
@media(max-width:767px) {
    #sakaeNews { padding: 7% 0; margin-top: 10%;}
    #sakaeNews .sakaeWrapper { flex-direction: column;}
    #sakaeNews h2 { font-size: 4.6vw; border-right: 0; border-bottom: 1px solid var(--bl0); padding-bottom: .4em; margin-bottom: .5em; width: 100%; text-align: center;}
    #sakaeNews ul { width: 100%; margin: 0;}
    #sakaeNews li { font-size: 3.6vw; display: flex;}
    #sakaeNews li span { padding-right: .8em;}
    #sakaeNews .btns { margin: 1.5em auto 0; width: 80%;}
    .evnBnr { margin-top: 10%;}
    .evnBnr img { max-width: 84%;}
}

/* BLOG */
.home-sakaePost li > a { display: block; background: #fff; height: 100%;}
.home-sakaePost li > a:hover { box-shadow: 0 3px 14px var(--bl3); transform: translateY(-10px);}
.home-sakaePost li > a img { border: 1px solid #eee;}
.home-sakaePost .btns a { margin-bottom: 0;}
.home-sakaePost li > a div { background: #fff; padding: 1.2em 1.5em 1.4em;}
.home-sakaePost h6 { font-size: 15px; display: flex; align-items: center; justify-content: flex-end; color: var(--bl1); margin-top: 1.2em; padding-top: 1em; border-top: 1px solid var(--bl1);}
.home-sakaePost h6 span { display: block; margin-right: .6em; padding: .1em .4em; border: 1px solid var(--bl1); background: #fff;}
.home-sakaePost h5 { font-size: 18px; line-height: 1.4; margin: .4em 0; color: var(--bl0);}
.home-sakaePost p { font-size: 14px; line-height: 1.5;}
@media(max-width:767px) {
    /* POST */
    .home-sakaePost ul { margin-top: 5%;}
    .home-sakaePost li { width: 100%;}
    .home-sakaePost li:not(:last-of-type) { margin-bottom: 6%;}
    .home-sakaePost li > a { padding: 1.2em; width: 100%; display: flex; align-items: flex-start; justify-content: space-between;}
    .home-sakaePost li > a img { width: 35%; height: auto; margin: 0;}
    .home-sakaePost li > a div { width: 60%; padding: 0;}
    .home-sakaePost h5 { font-size: 1.7rem; display: block; margin-top: 0;}
    .home-sakaePost h6 { font-size: 1.5rem; margin-top: 1em; padding-top: .5em;}
    .home-sakaePost h6 span { font-size: 1.4rem; display: inline-block; margin: 0 0 .3em;}
    .home-sakaePost p { font-size: 1.2rem; line-height: 1.3;}
}



/* RECOMMENDED */
#storeRecs .sakaeWrapper { margin-top: 0;}
#storeRecs .sakaeWrapper > dl { display: flex; align-items: center; justify-content: center;}
#storeRecs .sakaeWrapper dt h3 { color: var(--red1); background: url(images/top/icon_daiya.svg) 50% 0 no-repeat; padding-top: 2.5em; text-align: center;}
#storeRecs .sakaeWrapper dt p { color: var(--red1); margin-top: 1.5em; text-align: center;}
#storeRecs .sakaeWrapper dt { width: 60%;}
#storeRecs .sakaeWrapper dd { width: 35%;}

#storeRecs .reason6 { padding: 2.4em 3em 3em 2.4em; background: #fff; border-radius: 14px; }
#storeRecs .reason6 h4 { margin-top: -2.2em;}
#storeRecs .reason6 h4 span { display: inline-block; color: #fff; padding: .5em 1.5em .6em; background: var(--red1); border-radius: 100px;}
#storeRecs .reason6 ul { display: flex; justify-content: space-between; flex-wrap: wrap; counter-reset: number 0;}
#storeRecs .reason6 li { position: relative; border: 2px solid var(--red1); border-radius: 14px; background: #fff; box-shadow: 7px 7px 0 var(--red1); width: 48%;margin-top: 4%; padding: 2.2em 2.6em 2.4em;}
#storeRecs .reason6 li h6 { color: var(--red1); margin-bottom: .4em;}
#storeRecs .reason6 li h6,
#storeRecs .reason6 li p { position: relative; z-index: 1;}
#storeRecs .reason6 li::after { 
    counter-increment: number 1;
    content: counter(number,decimal-leading-zero) "";
    font-family: 'Zen Maru Gothic';
    font-weight: 900;
    font-size: 130px;
    position: absolute;
    right: 4%;
    bottom: -4%;
    color: #fae8e8;
}

@media(min-width:1400px) {
    #storeRecs dt h3 { font-size: 34px;}
}

@media(max-width:767px) {
    #storeRecs .sakaeWrapper > dl { flex-direction: column;}
    #storeRecs .sakaeWrapper dt h3 { background-position: 50% 0; padding: 8vw 0 0; min-height: auto; background-size: 9vw; text-align: center;}
    #storeRecs .sakaeWrapper dt h6 { margin-top: 1em;}
    #storeRecs .sakaeWrapper dt { width: 100%;}
    #storeRecs .sakaeWrapper dd { width: 60%; margin-top: 6%;}

    #storeRecs .reason6 { padding: 2em 2.6em 2.6em 2em; position: relative; z-index: 2;}
    #storeRecs .reason6 h4 { margin-top: -3.7em; text-align: center;}
    #storeRecs .reason6 h4 span { display: block;}
    #storeRecs .reason6 ul { flex-direction: column;}
    #storeRecs .reason6 li { width: 100%; margin-top: 10%; padding: 1.8em 2.2em 2em;}
    #storeRecs .reason6 li::after { font-size: 26vw; bottom: -7%;}
}


/* BEGGINER */
#beginBnr .sakaeWrapper { margin-top: 0; border: 2px solid #35aa97; background: rgba(255,255,255,.65); border-radius: 20px; overflow: hidden;}
#beginBnr h2 { text-align: center; color: #35aa97; padding: .6em 0; line-height: 1;}
#beginBnr h2 strong { color: var(--red1);}
#beginBnr h5 { text-align: center; color: var(--pp2); margin: 0 0 1em;}
#beginBnr .zenmaru span { font-size: calc(1em + 10px); position: relative; top: 2px;}
#beginBnr .btns a { margin-bottom: 0;}


/* CONCEPT */
.sakaeConcept dl { display: flex; align-items: center; justify-content: space-between;}
.sakaeConcept dt { width: 50%;}
.sakaeConcept dd { width: 50%; padding: 3em; background: rgba(255,255,255,.65);}
.sakaeConcept dd p { line-height: 2;}
@media(max-width:767px) {
    .sakaeConcept dl { flex-direction: column; margin-bottom: 8%;}
    .sakaeConcept dt,
    .sakaeConcept dd  { width: 100%;}
    .sakaeConcept dd  { padding: 2em;}
}

/* point6 */
.point6 { margin-top: 5%; background: #fff; border: 2px solid var(--bl1); padding: 0 1.5% 1.5%; border-radius: 20px;}
.point6 h3 { text-align: center; margin-bottom: 1.5em;}
.point6 h3 span { display: inline-block; padding: .4em 2.4em .5em; border-bottom-left-radius: 20px; border-bottom-right-radius: 20px; background: var(--bl1); color: #fff;}
.point6 li { position: relative; padding: 2.4em; margin: 0; width: 33.3333%;}
.point6 li::after, .point6 li::before {
    content: "";
    position: absolute;
    width: 88%;
    height: 88%;
    display: block;
}
.point6 li::after {
    border-right: 1px dashed var(--bl1);
    width: 100%;
    top: 50%;
    left: 0;
    transform: translate(-0%,-50%);
}
.point6 li::before {
    border-top: 1px dashed var(--bl1);
    top: 0%;
    left: 50%;
    transform: translate(-50%,-0%);
}
.point6 li:nth-child(1)::before, .point6 li:nth-child(2)::before, .point6 li:nth-child(3)::before { display: none;}
.point6 li:nth-child(3)::after, .point6 li:nth-child(6)::after { display: none;}
.point6 li h5 { text-align: center; color: var(--bl1); line-height: 1.4; margin-top: .6em;}
.point6 li h6 { position: absolute; left: .5em; top: .5em; z-index: 5; font-size: 30px; width: 54px; height: 54px; background: var(--bl1); color: #fff; display: flex; align-items: center; justify-content: center; border-radius: 50%;}
.point6 li img { border: 1px solid var(--bl1);}

@media(max-width:767px) {
    .point6 { margin-top: 12%;}
    .point6 h3 { text-align: center; margin-bottom: 0; z-index: 5;}
    .point6 h3 span { padding: .4em 1.2em .7em; font-size: 4.6vw;}
    .point6 ul { border-radius: 10px; padding-top: 6%;}
    .point6 li { padding: 5%; width: 50%;}
    .point6 li:nth-child(1)::before,
    .point6 li:nth-child(2)::before,
    .point6 li:nth-child(3)::before,
    .point6 li:nth-child(4)::before,
    .point6 li:nth-child(5)::before,
    .point6 li:nth-child(6)::before { display: none;}
    .point6 li:nth-child(1)::after,
    .point6 li:nth-child(2)::after,
    .point6 li:nth-child(3)::after,
    .point6 li:nth-child(4)::after,
    .point6 li:nth-child(5)::after,
    .point6 li:nth-child(6)::after { display: none;}
    .point6 li:nth-child(3)::before,
    .point6 li:nth-child(4)::before,
    .point6 li:nth-child(5)::before,
    .point6 li:nth-child(6)::before { display: block;}
    .point6 li:nth-child(2n-1)::after { display: block;}
    .point6 li h5 { font-size: 3.2vw;}
    .point6 li h6 { left: .5em; top: .5em; font-size: 4.2vw; width: 30px; height: 30px;}
}


/* LIFE STYLE */
.sakaeLifestyle .sakaeWrapper { display: flex; align-items: center; justify-content: center; flex-wrap: wrap;
background-image: url(images/top/lifestyle_bg01.png), url(images/top/lifestyle_bg02.png);
background-position: 100% 10%, 0 100%;
background-repeat: no-repeat;
background-size: 25%, 25%;
}
.sakaeLifestyle .sakaeWrapper div { display: flex; flex-direction: column; align-items: center; justify-content: center; margin: 0 0 1%; width: 320px; height: 320px; background: rgba(255,255,255,.7); border-radius: 50%; overflow: hidden;}
.sakaeLifestyle .sakaeWrapper div:nth-of-type(2) { margin-right: 200px; padding-top: 2%;}
.sakaeLifestyle .sakaeWrapper div:nth-of-type(3) { margin-left: 200px;}
.sakaeLifestyle .sakaeWrapper div:nth-of-type(1) { margin-right: 4%; padding-top: 5%;}
.sakaeLifestyle .sakaeWrapper div:nth-of-type(4) { margin-left: 4%;}
.sakaeLifestyle .sakaeWrapper div h4, .sakaeLifestyle .sakaeWrapper div p { text-align: center;}
.sakaeLifestyle .sakaeWrapper div h4 { color: var(--red1);}
.sakaeLifestyle .sakaeWrapper div p { margin-bottom: 1em;}
@media(max-width:767px) {
    .sakaeLifestyle .sakaeWrapper {
    flex-direction: column;
    background-size: 42%, 37%;
    background-position: 0% 100%, 100% 100%;
    padding-bottom: 35%;
    }
    .sakaeLifestyle .sakaeWrapper div { width: 70vw; height: 70vw;}
    .sakaeLifestyle .sakaeWrapper div:nth-of-type(1) { margin-right: auto; padding-top: 24%;}
    .sakaeLifestyle .sakaeWrapper div:nth-of-type(2) { margin-right: 0; margin-left: auto; padding-top: 2%;}
    .sakaeLifestyle .sakaeWrapper div:nth-of-type(3) { margin-left: 0; margin-right: auto; padding-top: 10%;}
    .sakaeLifestyle .sakaeWrapper div:nth-of-type(4) { margin-left: auto;}
}


/* SYSTEM */
.arB { background: #fff; padding: 3em 4em; border: 2px solid var(--bl1); border-radius: 20px;}
.arB > h2, .arB > h3, .arB > h4 { text-align: center; margin-bottom: 1.4em;}

.sakaeSystems .sakaeWrapper { border-color: var(--bl1);}
.sakaeSystems .sakaeWrapper > h3 { color: var(--bl1); margin-bottom: 1em;}
.sakaeSystems .sakaeWrapper > h6 { text-align: center;}
#rmr { margin-top: 5%;}
#rmr li { margin-bottom: 0; padding: 3% 4%; border-radius: 10px;}
#rmr h4 { text-align: center; margin-bottom: .5em; font-weight: bold;}
#rmr h5, #rmr p { text-align: center;}
#rmr h5 strong { display: block; font-weight: 500;}
#rmr ul { margin-bottom: 5%;}
#rmr li img { margin: 5% 0;}
#rmr li:first-child { background: #d9edb2;}
#rmr li:last-child { background: #c1e8ea;}
#rmr li:first-child h4, #rmr li:first-child h5 strong { color: #008906;}
#rmr li:last-child h4, #rmr li:last-child h5 strong { color: #005B93;}
#rmr li:last-child p strong { text-align: center; margin-bottom: .5em;}

.remu .icnT, body.sidejob .icnT { color: var(--block-remuneration-theme);}
.remu .icnT > span, body.sidejob .icnT > span { background: var(--block-remuneration-theme); margin: 0;}
.remu .icnT > span img, body.sidejob .icnT > span img { width: 60%; position: relative; top: -2px;}

.remu1 dl, .remu2 dl { display: flex; align-items: center; justify-content: space-between;}
.remu1 dt, .remu2 dt { width: 55%;}
.remu1 dd, .remu2 dd { width: 40%;}
.remu1 dd img, .remu2 dd img { border-radius: 30px; border: 1px solid var(--bl3);}
.remu1 dt h5 span { display: inline-block; padding: .4em 1em .6em; min-width: 10em; color: #fff; text-align: center;}
.remu1 dt h5:first-of-type span { background-color: var(--bl1);}
.remu1 dt h5:last-of-type span { background-color: var(--red1); margin-top: 1.5em;}
.remu1 dt h6:first-of-type { color: var(--bl1);}
.remu1 dt h6:last-of-type { color: var(--red1);}
.remu1 dt h6 { margin-top: .8em;}
.remu1 dt p { margin-top: 1em; font-weight: 500; color: var(--red1);}
.remu2 dt h5 { line-height: 1.8;}
.remu2 dt h5 strong { display: inline-block; padding: 0 .2em; color: var(--red1); font-size: calc(1em + 14px);}
.remu2 dt h6 { font-weight: 500; margin-top: 1em;}
.remu2 dt h6 strong { font-weight: 700; color: var(--red1);}
.remu2 > img { margin: 5% auto 1%;}

@media(max-width:767px) {
    .arB { padding: 2em; border-radius: 14px;}
    .sakaeSystems .sakaeWrapper.arB:first-of-type > h3 { font-size: 4.2vw;}
    .remu1 dl, .remu2 dl { flex-direction: column;}
    .remu1 dt, .remu2 dt { width: 100%;}
    .remu1 dd, .remu2 dd { width: 85%; margin-top: 8%;}
    .remu1 dd img, .remu2 dd img { border-radius: 18vw;}
    .remu1 dt h5 span { min-width: 10em;}
    .remu2 dt h5 { line-height: 1.8;}
    .remu2 dt h5 strong { font-size: 6.2vw;}
    .remu2 > img { margin: 10% 0 1%;}
    #rmr { margin-top: 0;}
    #rmr li { margin-top: 8%; padding: 2em;}

}


/* REASON */
.sakaeReason ul { display: flex; justify-content: space-between; flex-wrap: wrap;}
.sakaeReason li { padding: 2.5% 3%; background: #fff; border: 2px solid var(--bl0); border-radius: 20px; width: 32%;}
.sakaeReason li h5 { text-align: center; color: var(--bl1);}
.sakaeReason li img { margin: 6% 0; border: 2px solid #fff; border-radius: 8px;}
.sakaeReason li:nth-child(-n+3) { margin-bottom: 2%;}
.sakaeReason li:nth-child(n+4) { width: 49%;}
@media(max-width:767px) {
    .sakaeReason ul { flex-direction: column;}
    .sakaeReason li { padding: 5.5% 5%; border-radius: 12px; width: 100%;}
    .sakaeReason li img { margin: 6% 0;}
    .sakaeReason li:nth-child(-n+4),
    .sakaeReason li:nth-child(-n+3) { margin-bottom: 6%;}
    .sakaeReason li:nth-child(n+4) { width: 100%;}
}


/* NATYU MORI */
.sakaeNatyumori dl { display: flex; align-items: center; justify-content: space-between;}
.sakaeNatyumori dt { width: 48%;}
.sakaeNatyumori dd { width: 48%; border-top-right-radius: 20px; border-bottom-right-radius: 20px; position: relative;}
.sakaeNatyumori dd h6 { color: var(--bl0); line-height: 2;}
.sakaeNatyumori dd h6 strong { color: var(--gr1);}
.sakaeNatyumori dd img { position: absolute; right: 5%; bottom: -24%; z-index: 1; width: 80px;}
@media(max-width:767px) {
    .sakaeNatyumori { padding-top: 10%;}
    .sakaeNatyumori dl { flex-direction: column;}
    .sakaeNatyumori dt { width: 86%; z-index: 1;}
    .sakaeNatyumori dd { width: 100%; border-radius: 12px; margin-top: -13%; padding: 18% 6% 6%;}
    .sakaeNatyumori dd img { right: 7%; bottom: -4%; z-index: 1; width: 17%;}
}

/* FLOW */
.sakaeFlow li { position: relative; border-radius: 14px; background: #fff; margin-bottom: 5%; padding: 4% 4.5%; display: flex; align-items: flex-start; justify-content: space-between; border: 2px solid var(--bl1);}
.sakaeFlow li:not(:last-child)::after { content: ""; position: absolute; bottom: -70px; left: 50%; margin-left: -40px; border: 40px solid transparent; border-top: 30px solid var(--bl1);}
.sakaeFlow li:last-child { margin-bottom: 0;}
.sakaeFlow li img { width: 45%; margin: 0; border-radius: 10px;}
.sakaeFlow li div { width: 50%;}
.sakaeFlow h5 { margin-bottom: .8em; color: var(--bl1);}
.sakaeFlow h5 span { display: inline-block; padding: .1em .7em .2em; border-radius: 6px; background: var(--bl1); color: #fff; margin-right: .8em; font-size: calc(1em - 4px);}

@media(max-width:767px) {
    .sakaeFlow li { margin-bottom: 8%; padding: 5% 5.5%; display: flex; flex-direction: column;}
    .sakaeFlow li:not(:last-child)::after { bottom: -50px; margin-left: -30px; border: 30px solid transparent; border-top: 20px solid var(--bl1);}
    .sakaeFlow li img { width: 100%; margin-bottom: 5%;}
    .sakaeFlow li div { width: 100%; padding: .2em .6em .6em;}
    .sakaeFlow h5 { margin-bottom: .6em;}
    .sakaeFlow h5 span { padding: .1em .7em .3em; margin-right: .8em; font-size: calc(1em - 2px);}
}


/*------------------------------------------------------------
	PAGE HEAD
------------------------------------------------------------ */
.pagehead { position: relative; background: url(images/top/main_bg.png) 50% 50% no-repeat; background-size: cover; padding: 0;}
.pagehead .sakaeWrapper { display: flex; align-items: center; justify-content: center; flex-direction: column; height: 260px;}
.pagehead h2 { position: relative; text-align: center; color: var(--bl1); display: inline-block; line-height: 1; padding: .5em .8em .6em; font-weight: 600; letter-spacing: 4px;
background: linear-gradient(90deg, #ff761b 10%, #fbb03b 90%);
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
}
.pagehead h2:before, .pagehead h2:after {
  content:'';
  width: 70px;
  height: 30px;
  position: absolute;
  display: inline-block;
}
.pagehead h2:before {
  border-left: solid 1px var(--bl0);
  border-top: solid 1px var(--bl0);
  top:0;
  left: 0;
}
.pagehead h2:after {
  border-right: solid 1px var(--bl2);
  border-bottom: solid 1px var(--bl2);
  bottom:0;
  right: 0;
}
.pagehead h6 { color: var(--bl1); display: inline-block; line-height: 1; font-weight: 600; margin-top: 1em;}

.read { padding: 5% 5% 0;}
.read h3 { position: relative; text-align: center; font-family: 'Noto Serif JP', serif; color: var(--bl1); letter-spacing: 4px; margin-bottom: 1em; font-weight: 500;}
.read p { text-align: center; color: #333; line-height: 2;}
.read .btns a { background: var(--bl2); margin-bottom: 0;}
.read .btns a:hover { background: var(--bl0)!important;}

.category-info .read { display: none;}

@media(max-width:767px) {
    .pagehead { background-size: 120%;}
    .pagehead .sakaeWrapper { height: 38vw;}
    .pagehead h2 { padding: .6em .8em .7em;}
    .pagehead h2:before, .pagehead h2:after { width: 60px; height: 25px;}
    .read { padding: 10% 0 0;}
    .read h3 { font-size: 5.8vw; letter-spacing: 2px;}
}


/*------------------------------------------------------------
	UNDERS
------------------------------------------------------------ */
/* COMMON */
.pglink { display: flex; align-items: center; justify-content: center; margin-top: 4%;}
.btns.pglink a { display: block; width: 24%; margin: 0 .5%; padding: .8em 1em 1em; font-size: 1.1vw; margin-bottom: 0;}

@media(min-width:1250px) {
    .btns.pglink a { font-size: 17px;}
}
@media(max-width:767px) {
    .pglink { flex-wrap: wrap; justify-content: space-between;}
    .btns.pglink a { width: 80%; min-width: 80%; margin: 1em auto 0; padding: .8em 1em 1em; font-size: 3.6vw;}
}


/*------------------------------------------------------------
	WORKS
------------------------------------------------------------ */
.works .btns.pglink a { width: 22%;}
.works .btns.pglink a:nth-of-type(3) { width: 24%;}
#works01 .sakaeWrapper { padding: 2em; background: rgba(255,255,255,.7); display: flex; align-items: flex-start; justify-content: space-between;}
#works01 .sakaeWrapper img { width: 45%; margin: 0;}
#works01 .sakaeWrapper div { width: 52%;}
#works01 .sakaeWrapper:nth-of-type(odd) { flex-direction: row-reverse;}
#works01 .sakaeWrapper:first-of-type { flex-direction: column;}
#works01 .sakaeWrapper:first-of-type img,
#works01 .sakaeWrapper:first-of-type div { width: 100%;}
#works01 .sakaeWrapper:first-of-type div { margin-top: 3%;}

#works02 dl { position: relative; display: flex; align-items: flex-start; justify-content: space-between; margin-top: 6.5%; padding: 2em; background: #fff; border: 1px solid var(--bl1);}
#works02 dl::before {
content: "";
position: absolute;
bottom: -70px;
left: 48.5%;
margin-left: -40px;
border: 40px solid transparent;
border-top: 30px solid var(--bl1);
}
#works02 dl:last-of-type::before { display: none;}
#works02 dt { position: relative; width: 40%;}
#works02 dd { position: relative; width: 57%; padding-top: 1.6em;}
#works02 dd h6 { position: absolute; top: -2.7em; left: -.6em; padding: .2em 1.5em .4em; background: var(--bl1); color: #fff; z-index: 5;
clip-path: polygon(10% 0%, 90% 0%, 100% 50%, 90% 100%, 10% 100%, 0% 50%);
-webkit-clip-path: polygon(10% 0%, 90% 0%, 100% 50%, 90% 100%, 10% 100%, 0% 50%);
}
#works02 dd h6 span { font-size: calc(1em + 6px); margin-left: .2em;}
#works02 h4, #works02 dd p strong { color: var(--red1);}
#works02 .sakaeWrapper > div { display: flex; align-items: center; justify-content: space-between; width: 94%; margin: 3% auto 0;}
#works02 .sakaeWrapper > div div { margin-right: 1%;}
#works02 .sakaeWrapper > div h3 { color: var(--red1); border-bottom: 1px solid var(--red1); margin-bottom: .6em; padding-bottom: .5em;}
#works02 .sakaeWrapper > div h5 { color: var(--bl1); text-indent: -1em; padding-left: 1em; margin-bottom: .3em;}
#works02 .sakaeWrapper > div p { margin-top: 1.5em;}
#works02 .sakaeWrapper > div img { margin: 0;}

#works03 { margin-top: 0;}

#privacy table { background: rgba(255,255,255,.45);}
#privacy h6, #privacy h3 { text-align: center;}
#privacy h6 { margin-bottom: .6em;}
#privacy h3 { line-height: 1.8; margin-bottom: 1.2em;}
#privacy strong { color: #f4454b; font-weight: 500;}
#privacy th, #privacy td { padding: 1.5em 2em; border: 1px solid #666;}
#privacy th { width: 20%; }
#privacy th h4 { text-align: center; margin: 0;}
#privacy h4 { font-family: 'Noto Serif JP', serif;}

#works04 .sakaeWrapper { border: 1px solid #fff;}
#works04 .sakaeWrapper div { padding: 4em 2em;}
#works04 .sakaeWrapper div h4, #works04 .sakaeWrapper div p { text-align: center;}
#works04 .sakaeWrapper div p { font-weight: 500; margin-top: 2em;}


@media(max-width:767px) {
    .works .btns.pglink a,
    .works .btns.pglink a:nth-of-type(3) { width: 75%;}
    #works01 .sakaeWrapper { margin-bottom: 5%; padding: 1.6em; flex-direction: column;}
    #works01 .sakaeWrapper img { width: 100%; margin: 0;}
    #works01 .sakaeWrapper div,
    #works01 .sakaeWrapper:first-of-type div { width: 100%; margin-top: 5%;}
    #works01 .sakaeWrapper:nth-of-type(odd),
    #works01 .sakaeWrapper:first-of-type { flex-direction: column;}
    #works01 .sakaeWrapper h4 { text-align: center;}

    #works02 { margin-top: 15%; padding: 8% 0 0;}
    #works02 dl { flex-direction: column-reverse; margin-top: 15%; padding: 1.6em;}
    #works02 dt { width: 100%;}
    #works02 dd { width: 100%; padding-top: 1.2em; margin-bottom: 5%;}
    #works02 dd h4 { text-align: center;}
    #works02 dd h6 { left: 50%; transform: translate(-55%,0);}
    #works02 .sakaeWrapper > div { flex-direction: column; justify-content: center; width: 90%; margin: 10% auto 0;}
    #works02 .sakaeWrapper > div div { margin-right: 0;}
    #works02 .sakaeWrapper > div h3 { text-align: center;}
    #works02 .sakaeWrapper > div h5 { margin-bottom: .5em;}
    #works02 .sakaeWrapper > div img { margin: 0 auto; width: 70%;}

    #privacy { margin-top: 15%; padding: 8% 0;}
    #privacy th, #privacy td { padding: 1em 1.5em;}
    #privacy th { width: 15%; }
    #privacy th h4 { text-align: center; margin: 0;}
    #privacy h4 { font-family: 'Noto Serif JP', serif; color: #555;}

    #works04 .ins div { padding: 2em;}
}


/*------------------------------------------------------------
	REMUNERATION
------------------------------------------------------------ */
#jobstyle h3 { text-align: center; color: var(--bl0); margin-bottom: 1.5em;}
#jobstyle .sakaeWrapper { padding: 3em; margin-top: 5%;}
#jobstyle .sakaeWrapper > div:first-of-type { display: flex; align-items: flex-start; justify-content: space-between; margin-bottom: 4%;}
#jobstyle .sakaeWrapper > div:first-of-type img { width: 48%; border: 1px solid var(--bl2); margin: 0;}
#jobstyle .sakaeWrapper > div:first-of-type div { width: 48%;}
#jobstyle .sakaeWrapper > div:first-of-type div h5 { color: var(--red1); margin-bottom: .3em;}
#jobstyle .sakaeWrapper > div:first-of-type div h5 i { margin-right: .2em;}
#jobstyle .sakaeWrapper > div:first-of-type div p { margin-top: 1.5em;}
#jobstyle .sakaeWrapper > div:last-of-type h4,
#jobstyle .sakaeWrapper  > h4 { margin-bottom: .8em; padding-bottom: .4em; border-bottom: 1px solid var(--red1);}
#jobstyle .sakaeWrapper > div:last-of-type li { margin: 2em 0 0;}
#jobstyle .sakaeWrapper > div:last-of-type li h6 { text-align: center; color: var(--red1); font-weight: 500;}
#jobstyle .sakaeWrapper > div:last-of-type li img { margin: 0 0 1em;}

.remuneration .read img { border-radius: 20px; border: 2px solid var(--bl1);}
.remuneration .cmnInf { margin-top: 0;}
#privilege { margin-top: 7%; padding: 5% 0 2%;}
#privilege li { border: 1px solid var(--bl1); background: #fff;}
#privilege li h5 { padding: 1em; color: #fff; text-align: center; background: var(--bl1);}
#privilege li h5 span { display: block; color: var(--yl1); margin-bottom: .6em;}
#privilege li p { padding: 1.2em;}
#privilege li p strong { display: block; text-indent: -1em; padding-left: 1em; margin-top: .5em; line-height: 1.4; font-weight: 500;}


@media(max-width:767px) {
    #jobstyle h3 { margin-bottom: 1em;}
    #jobstyle .sakaeWrapper { padding: 1.6em; margin-top: 10%;}
    #jobstyle .sakaeWrapper > div:first-of-type { flex-direction: column; margin-bottom: 7%;}
    #jobstyle .sakaeWrapper > div:first-of-type img { width: 100%; margin: 0 0 1.5em;}
    #jobstyle .sakaeWrapper > div:first-of-type div { width: 100%;}
    #jobstyle .sakaeWrapper > div:last-of-type li { width: 48%; margin: 1.5em 0 0;}
    #jobstyle .sakaeWrapper > div:last-of-type li h6 { font-size: 3.4vw;}
    #jobstyle .sakaeWrapper > div:last-of-type li img { margin: 0 0 .6em;}
    #jobstyle #jobstyle02 > div:last-of-type { flex-direction: column;}
    #jobstyle #jobstyle02 > div:last-of-type img { width: 60%; margin: 5% 0 0 0;}

    #privilege { margin-top: 15%; padding: 8% 0 2%;}
    #privilege li { margin-bottom: 5%;}
    #privilege li h5 { font-size: 4.6vw;}
    #privilege li h5 span { margin-bottom: .4em;}
    #privilege li p { padding: 1.2em 1.5em;}
    .remuneration main > img { max-width: 84%; margin-top: 8%;}
}


/* simuration */
.simu h3 { text-align: center; margin-bottom: 1em; color: var(--bl0);}
.simu h3 span { display: block; color: var(--block-system-theme); font-size: calc(1em - 10px); margin-top: .5em;}

.simuQ { margin-top: 5%;}
.simuQ label, .simuQ input, .simuQ .fields::before { font-size: 24px; font-weight: 500;}
.simuQ label { cursor: pointer;}
.simuQ input { font-size: 20px;}

#formheader_1 { display: none;}

.simuQ .fields { position: relative; overflow: hidden; padding: 1.5em 1.5em 1.5em 20%!important;}
.simuQ .fields::before {
    content: "質問01";
    width: 15%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    padding: 0;
    background: var(--bl1);
    color: #fff;
    display: flex; align-items: center; justify-content: center;
}
.simuQ .fields:nth-of-type(2)::before { content: "質問02";}
.simuQ .fields:nth-of-type(3)::before { content: "質問03";}
.simuQ .fields:nth-of-type(4)::before { content: "質問04";}
.simuQ .fields:nth-of-type(5)::before { content: "質問05";}
.simuQ .fields:nth-of-type(6)::before { content: "質問06";}
.simuQ .fields:nth-of-type(7)::before { content: "質問07";}
.simuQ .fields:nth-of-type(8)::before { content: "質問08";}
.simuQ .fields:nth-of-type(9)::before { content: "質問09";}
.simuQ .fields:nth-of-type(10)::before { content: "質問10";}
.simuQ .fields.cff-calculated-field::before { display: none;}
.simuQ .fields > label { color: var(--bl0); font-size: calc(1em + 12px);}
.simuQ .fields .one_column span { color: var(--bl0); display: inline-block; margin-left: .3em;}

.simuQ .fields:not(.cff-container-field) { border-radius: 14px; background: #fff; margin-bottom: 1.5em;}
.simuQ .fields:not(.cff-switch-container) input[type="radio"] { width: 20px!important; height: 20px!important;}
.simuQ .fields:not(.cff-switch-container) input[type="radio"]:checked { border: 2px solid var(--bl1)!important;}
.simuQ .fields:not(.cff-switch-container) input[type="radio"]:checked::before { background-color: var(--bl1)!important; width: 10px!important; height: 10px!important; }
.cp_cff_13 #fbuilder input[readonly] { background: none!important; border: 0!important; font-size: 36px!important; color: var(--red1)!important; width: 100%!important; text-align: center!important; font-weight: 600!important; line-height: 1.2!important;}
.cp_cff_13 #fbuilder input:focus { border: 0!important; box-shadow: none!important; outline: 0!important;}
#fbuilder .cff-radiobutton-field .dfield label { margin-top: .4em!important;}

.simuQ .fields.cff-calculated-field { width: 60%!important; margin: 0 auto!important; border: 2px solid var(--bl1); text-align: center!important; padding-left: 1.5em!important;}
@media(max-width:767px) {
    /* simuration */
    .simu h3 { margin-bottom: 1.5em;}
    .simu h3 span { font-size: calc(1em - 5px); margin-top: .7em;}
    .simuQ { margin-top: 6%;}
    .simuQ label, .simuQ input, .simuQ .fields::before { font-size: 4.4vw;}
    .simuQ input { font-size: 4.2vw;}
    .simuQ .fields { padding: 20% 1.5em 1.5em 1.5em!important;}
    .simuQ .fields::before {
        font-size: 4.6vw;
        padding: .7em 0;
        width: 100%;
        height: auto;
        text-align: center;
    }
    .cp_cff_13 #fbuilder input[readonly] { font-size: 8.2vw!important;}
    .simuQ .fields:last-of-type { width: 84%!important; padding-top: 1.5em!important;}
    .simuQ .fields > label { font-size: calc(1em + 4px);}
}

/*------------------------------------------------------------
	FLOW
------------------------------------------------------------ */
#mibun h5,
#mibun h3,
#mibun p { text-align: center;}
#mibun h5 span { display: inline-block; padding: .8em 2em; line-height: 1; border: 1px solid #999;}
#mibun h3 { margin: 1em 0;}
#mibun h3 strong { font-weight: 500;}
#mibun article { border: 1px solid #999; margin: 5% auto 0; width: 80%; background: rgba(255,255,255,.45);}
#mibun article > h4 { text-align: center; color: #555; border-bottom: 1px solid #999; margin: 0; padding: 1.2em 0; line-height: 1;}
#mibun article > div { display: flex; align-items: center; justify-content: center;}
#mibun article > div img { width: 35%; margin: 0;}
#mibun article > div h4 { line-height: 2; margin: 0;}
#mibun article i { margin-right: .4em;}
#mibun article:first-of-type > div { padding: 2em;}
#mibun article:last-of-type > div h4,
#mibun article:last-of-type > div p { padding: 2em; width: 50%; text-align: left;}
#mibun article:last-of-type > div h4 { border-right: 1px solid #999;}
@media(max-width:767px) {
    #step { margin-top: 15%;}
    #step li { width: 100%!important; padding: 1.6em; margin: 0 auto 10%; flex-wrap: wrap;}
    #step li div, #step li img { width: 100%; margin: 0;}
    #step li div { margin-bottom: 4%;}
    #mibun h5 span { padding: .8em 1.2em;}
    #mibun h3 { margin: .8em 0; font-size: 6vw;}
    #mibun article { margin: 8% auto 0; width: 92%;}
    #mibun article > h4 { padding: 1em 0; line-height: 1;}
    #mibun article > div { flex-direction: column; align-items: flex-start;}
    #mibun article > div img { width: 80%; margin: 2% auto 0;}
    #mibun article > div h4 { line-height: 1.6; margin: 0;}
    #mibun article:first-of-type > div { padding: 1.6em;}
    #mibun article:last-of-type > div h4 { padding: 1em 1em 0; width: 100%;}
    #mibun article:last-of-type > div p { padding: 1em 1.6em 1.5em; width: 100%;}
    #mibun article:last-of-type > div h4 { border-right: 0;}
}


/*------------------------------------------------------------
	VOICE
------------------------------------------------------------ */
#ladybeaf .arB { display: flex; align-items: flex-start; justify-content:space-between; border-color: var(--pp1);}
#ladybeaf .arB:not(:first-of-type) { margin-top: 6%;}
#ladybeaf .arB img { width: 48%; margin: 0;}
#ladybeaf .arB div { width: 48%;}
#ladybeaf .arB h5 { text-align: left; margin: 0 0 .8em; padding: .5em .8em; line-height: 1; background: var(--pp1); color: #fff;}
#ladybeaf .arB h6 { margin: .8em 0; color: var(--pp1);}

#ladyVoice dl { display: flex; align-items: center; justify-content:space-between; padding: 2em; margin-bottom: 5%; background: #fff; border: 2px solid var(--bl1); border-radius: 20px;}
#ladyVoice dl:last-of-type { margin: 0;}
#ladyVoice dt { width: 35%;}
#ladyVoice dt img:first-of-type { margin: 0; border-radius: 50%;}
#ladyVoice dt img:last-of-type { max-width: 65%;}
#ladyVoice dt h6 { text-align: center; margin: .5em 0 .8em;}
#ladyVoice dd { width: 60%;}
#ladyVoice dd div { margin-top: 2em; padding: 1em 2em; background: var(--bl1);}
#ladyVoice dd h4 { padding-bottom: .4em; margin-bottom: .8em; border-bottom: 2px solid var(--bl1);}
#ladyVoice dd h6 { margin: 0 0 .2em; color: var(--yl1);}
#ladyVoice dd h6 i { color: var(--yl1); margin-right: .3em; font-size: calc(1em + 4px);}
#ladyVoice dd div p { font-weight: 500; color: #fff;}

@media(max-width:767px) {
    #ladybeaf .arB { flex-direction: column;}
    #ladybeaf .arB:not(:first-of-type) { margin-top: 8%;}
    #ladybeaf .arB img,
    #ladybeaf .arB div { width: 100%;}
    #ladybeaf .arB div { margin-top: 8%;}
    
    #ladyVoice dl { margin-top: 6%; padding: 2em 1.6em 1.6em; flex-direction: column; border: 1px solid var(--bl1);}
    #ladyVoice dt { width: 65%; margin: 0 auto;}
    #ladyVoice dt img:last-of-type { max-width: 90%;}
    #ladyVoice dd { width: 100%; margin-top: 8%;}
    #ladyVoice dd div { margin-top: 1.5em; padding: 1em 1.5em;}
}


/*------------------------------------------------------------
	FAQ
------------------------------------------------------------ */
.faq .read .btns { flex-wrap: wrap;}
.faq .read .btns a:nth-of-type(-n+4) { margin-bottom: 2%;}
.faqs .sakaeWrapper { max-width: 880px; margin-top: 6%;}
.faqs .sakaeWrapper:first-of-type { margin-top: 0;}

.acd { margin-top: 1.3em;}
.acd input { display: none;}
.acd label { width: 100%; padding: 1em 3em 1.2em 1.8em; cursor: pointer; position: relative; display: block; background: #fff; color: var(--bl0); border: 1px solid var(--bl1); transition: all 0.25s;}
.acd label:hover { background: var(--bl4);}
.acd label::after,
.acd label::before {
content: "";
position: absolute;
top: 50%;
right: 1em;
transform-origin :50% 50%;
width: 20px;
height: 2px;
background-color: var(--bl1);
transition: all 0.25s;
}
.acd label::after { transform: rotate(-90deg); }
.acd > div { height: 0; overflow: hidden; opacity: 0; transition: 0.25s; background: #fff; border: 1px solid var(--bl1); border-top: 0;}
.acd input:checked ~ div { height: auto; opacity: 1; padding: 1em 1.5em 1.6em 4em;}
.acd input:checked ~ label::before { transform: rotate(0deg);}
.acd input:checked ~ label::after { transform: rotate(180deg);}
.acd input:checked ~ label { border-bottom-left-radius: 0; border-bottom-right-radius: 0;}
.acd label h5, .acd > div div { display: flex; align-items: center; margin: 0;}
.acd > div div { align-items: flex-start;}
.acd label h5 span { display: block; margin-right: .4em; font-weight: bold; font-size: calc(1em + 6px); color: var(--bl1);}
.acd > div div h5 { color: var(--bl1); margin-right: .4em; font-weight: 600;}
.acd > div div p { padding-top: .3em;}
.acd > div div p a { display: block; margin-top: .4em; color: var(--bl1); text-decoration: underline;}
.acd > div div p a:hover { text-decoration: none;}

#ladyFaq .btns a { margin-top: 1.5em;}
#ladyFaq .btns h4 { text-align: center; color: var(--pp2);}

#ladyFtr .sakaeWrapper { display: flex; align-items: center; padding: 2em 3em;}
#ladyFtr .sakaeWrapper div h4 { margin-bottom: .8em; padding-bottom: .4em; border-bottom: 1px solid var(--bl1);}
#ladyFtr .sakaeWrapper div p strong { color: var(--red1);}
#ladyFtr .sakaeWrapper img { width: 30%; margin-left: 4%;}
#ladyFtr .btns { margin-top: 5%;}
#ladyFtr .btns a { margin-top: 1.5em;}
#ladyFtr .btns h4 { text-align: center; color: var(--pp2);}

@media(max-width:767px) {
    .faqs .sakaeWrapper { margin-top: 12%;}
    .faq .read .btns a:nth-of-type(-n+4) { margin-bottom: 0;}
    .acd { margin-top: 1em;}
    .acd label::after,
    .acd label::before { width: 18px; }
    .acd label { padding: .6em 2.5em .75em 1em; font-size: 4.5vw;}
    .acd input:checked ~ div {  padding: 1.3em 1.4em;}
    .acd label h5 { line-height: 1.4;}
    .acd label h5 span { display: block; margin-right: .4em; font-weight: bold;}
    .acd > div div p { padding-top: .2em;}
    #ladyFaq { margin-top: 15%; padding: 8% 0;}
    #ladyFaq .btns,
    #ladyFtr .btns { margin-top: 10%;}
    #ladyFaq .btns h4,
    #ladyFtr .btns h4 { font-size: 4vw;}
    #ladyFtr .sakaeWrapper { flex-direction: column; padding: 1.6em 1.6em .5em;}
    #ladyFtr .sakaeWrapper img { width: 70%; margin: 5% auto;}
}


/*------------------------------------------------------------
	SHOP
------------------------------------------------------------ */
.store .read .btns { flex-wrap: wrap;}
.store .read .btns a { width: 32%;}
.store .read .btns a:nth-of-type(-n+3) { margin-bottom: 2%;}
#shoplist { padding-top: 5%;}
#shoplist .sakaeWrapper { margin-top: 6%;}
#shoplist > a { width: 70%; max-width: 750px; display: block; margin: 0 auto;}
#shoplist .sakaeWrapper > h3 { text-align: center; color: var(--bl1); margin-bottom: .8em;}
#shoplist .sakaeWrapper > h3 span { position: relative; display: inline-block; padding: 0 55px;}
#shoplist .sakaeWrapper > h3 span::before, #shoplist .sakaeWrapper > h3 span::after {
  content: '';
  position: absolute;
  top: 55%;
  display: inline-block;
  width: 45px;
  height: 1px;
  background-color: var(--bl1);
}
#shoplist .sakaeWrapper > h3 span::before { left:0;}
#shoplist .sakaeWrapper > h3 span::after { right: 0;}

#shoplist #tohoku .clm3 { justify-content: center;}
#shoplist #tohoku .clm3::after { display: none;}
#shoplist #tohoku .clm3 li { margin: 0 1% 2.5%;}

#shoplist li { border: 1px solid #fff; background: rgba(255,255,255,.7); margin: 0 0 2.5%;}
#shoplist li > div { padding: 1.2em;}
#shoplist li h4 { color: var(--bl1); padding-bottom: .4em; margin-bottom: .5em; border-bottom: 1px solid var(--bl1);}
#shoplist li h4 span { font-size: calc(1em - 5px); display: block; font-weight: normal;}
#shoplist li h4 a:hover { color: var(--bl0);}

@media(max-width:767px) {
    .store .read .btn { width: 48%;}
    .store .read .btns a:nth-of-type(-n+3) { margin-bottom: 0;}
    #shoplist { padding-top: 7%;}
    #shoplist .sakaeWrapper { margin-top: 10%;}
    #shoplist .sakaeWrapper > h3 { font-size: 6vw;}
    #shoplist li > div { padding: 1em;}
    #shoplist li p {  font-size: 1.2rem; line-height: 1.4;}
    #shoplist li.w100 { width: 100%;}
    #shoplist .clmBox { justify-content: space-between;}
    #shoplist li { margin: 0 0 3.5%; width: 48.5%;}
    #shoplist #tohoku .clm3,
    #shoplist #kansai .clm3 { justify-content: space-between;;}
    #shoplist #tohoku .clm3::after,
    #shoplist #kansai .clm3::after { display: none;}
    #shoplist #tohoku .clm3 li,
    #shoplist #kansai .clm3 li { margin: 0 0 3.5%;}
}


/*------------------------------------------------------------
	FTR
------------------------------------------------------------ */
.ftr .read .btns { flex-wrap: wrap;}
.ftr .read .btns a { width: 32%;}
.ftr .read .btns a:nth-of-type(4),
.ftr .read .btns a:nth-of-type(5) { width: 48.5%;}
.ftr .read .btns a:nth-of-type(-n+5) { margin-bottom: 2%;}
.ftr .sakaeWrapper h4 { margin-bottom: .8em; padding-bottom: .4em; border-bottom: 1px solid var(--bl1);}
.ftr section > h2 { margin-bottom: 2.2em;}
.ftr .sakaeWrapper h5 { color: var(--bl1); margin-bottom: .5em;}
.ftr .sakaeWrapper h6 { color: #555;}
.ftr .sakaeWrapper .btms { margin-bottom: 2em;}
.ftr .bg-w { padding: 35px;}
.ftr th, .ftr td { padding: 1.2em 1.6em; border: 1px solid #ccc;}
.ftr th { background: #fff;}
.ftr .cnt { text-align: center;}
.ftr table { margin: 3% auto; width: 100%;}
.ftr p > a { display: inline-block; text-decoration: underline; color: #0a5f99; margin-top: .5em;}
.ftr p > a:hover { text-decoration: none;}

#shinkoku .sakaeWrapper:first-of-type { display: flex; align-items: center; margin-bottom: 2.5%;}
#shinkoku .sakaeWrapper:first-of-type div p strong { color: var(--bl1);}
#shinkoku .sakaeWrapper:first-of-type img { width: 30%; margin-left: 4%;}
#shinkoku .sakaeWrapper dl { display: flex; justify-content: space-between; margin-bottom: 2%;}
#shinkoku .sakaeWrapper dt, #shinkoku .sakaeWrapper dd { width: 48%; border: 2px solid var(--bl1); padding: 2em;}

#shinkoku-about .sakaeWrapper dl, #shinkoku-risk .sakaeWrapper dl { display: flex; justify-content: space-between;}
#shinkoku-about .sakaeWrapper dt, #shinkoku-about .sakaeWrapper dd,
#shinkoku-risk .sakaeWrapper dt, #shinkoku-risk .sakaeWrapper dd { width: 48%;}
#shinkoku-about h6 { padding: .6em; border: 1px solid #ccc;}
#shinkoku-about h6:last-of-type { margin: -1px 0 .6em;}

#shinkoku-flow .sakaeWrapper:not(:last-of-type) { margin-bottom: 2.5%;}
#shinkoku-flow table:first-of-type td { width: 50%;}
#shinkoku-flow table:nth-of-type(2) th { width: 45%;}
#shinkoku-flow table:nth-of-type(2) td { width: 55%;}
#shinkoku-flow table:nth-of-type(3) th,
#shinkoku-flow table:nth-of-type(3) td { width: 100%; display: block;}
#shinkoku-flow img { border: 2px solid var(--bl1); margin-bottom: 3%;}

#shinkoku-exp article table th,
#shinkoku-exp article table td { min-width: 33%;}
#shinkoku-exp .sakaeWrapper:first-of-type > div { display: flex; align-items: flex-start; justify-content: space-between;}
#shinkoku-exp .sakaeWrapper:first-of-type > div > p,
#shinkoku-exp .sakaeWrapper:first-of-type > div table { width: 48%; margin: 0;}
#shinkoku-exp .sakaeWrapper:last-of-type { display: flex; justify-content: space-between; margin-top: 2%;}
#shinkoku-exp .sakaeWrapper:last-of-type div { width: 31.5%;}
#shinkoku-exp .sakaeWrapper:last-of-type div hr { margin: 1.4em 0;}
#shinkoku-exp .sakaeWrapper:last-of-type div h6 { color: var(--bl1); padding: 1em 1.5em; background: #e9e9e9; margin-top: 1em; text-align: center;}
#shinkoku-exp .sakaeWrapper:last-of-type div .caption { margin-top: 1em;}

#shinkoku-faq li { padding: 2em; border: 1px solid var(--bl3);}
#shinkoku-faq li:not(:last-of-type) { margin-bottom: 3%;}
#shinkoku-faq li h5 { margin-bottom: .8em; text-indent: -2.6em; padding-left: 2.6em;}
#shinkoku-faq li p { display: flex; align-items: flex-start;}
#shinkoku-faq li p span { margin: 0 1em 0 .8em; color: var(--bl1); font-size: 1.9vw; font-weight: 500; line-height: 1; display: block;}

@media(min-width:1300px) {
    .ftr h6 { font-size: 18px; }
    #shinkoku-faq li p span { font-size: 22px;}
}
@media(max-width:767px) {
    .ftr section > h2 { margin-bottom: 2em;}
    .ftr .sakaeWrapper h6 { font-size: 3.8vw;}
    .ftr .sakaeWrapper .btms { margin-bottom: 1.6em;}
    .ftr .bg-w { padding: 1.6em;}
    .ftr th, .ftr td { display: block; width: 100%;}
    .ftr table { margin: 6% auto;}

    #shinkoku .sakaeWrapper:first-of-type { padding: 1.6em 1.6em .5em;}
    #shinkoku .sakaeWrapper:first-of-type { flex-direction: column;}
    #shinkoku .sakaeWrapper:first-of-type img { width: 70%; margin: 5% auto;}
    #shinkoku .sakaeWrapper dl { flex-direction: column; margin-bottom: 2%;}
    #shinkoku .sakaeWrapper dt, #shinkoku .sakaeWrapper dd { width: 100%; margin-bottom: 1em; padding: 1.6em; border-width: 1px;}

    #shinkoku-about .sakaeWrapper dl, #shinkoku-risk .sakaeWrapper dl { flex-direction: column;}
    #shinkoku-about .sakaeWrapper dt, #shinkoku-about .sakaeWrapper dd,
    #shinkoku-risk .sakaeWrapper dt, #shinkoku-risk .sakaeWrapper dd { width: 100%;}
    #shinkoku-about .sakaeWrapper dt,
    #shinkoku-risk .sakaeWrapper dt { margin-bottom: 5%;}
    #shinkoku-about h6 { padding: .8em 1em;}
    #shinkoku-about h5 { margin-bottom: .8em;}
    #shinkoku-about h6:last-of-type { margin: -1px 0 .8em;}

    #shinkoku-flow .sakaeWrapper:not(:last-of-type) { margin-bottom: 5%;}
    #shinkoku-flow table:first-of-type td,
    #shinkoku-flow table:nth-of-type(2) th,
    #shinkoku-flow table:nth-of-type(2) td,
    #shinkoku-flow table:nth-of-type(3) th,
    #shinkoku-flow table:nth-of-type(3) td { width: 100%; display: block;}
    #shinkoku-flow table:first-of-type tr:last-of-type td:last-of-type { display: none;}
    #shinkoku-flow img { margin-bottom: 6%;}

    #shinkoku-exp article { margin: 6% 0;}
    #shinkoku-exp article table { margin: 0 0 2%;}
    #shinkoku-exp article table th,
    #shinkoku-exp article table td { width: auto; display: table-cell;}
    .scls { overflow: auto;}
    .scls::-webkit-scrollbar { height: 10px; }
    .scls::-webkit-scrollbar-track { background: #f0f0f0;}
    .scls::-webkit-scrollbar-thumb { background: var(--bl1); border-radius:20px;}
    .scls td, .scls th {white-space: nowrap;}

    #shinkoku-exp .sakaeWrapper:first-of-type > div { flex-direction: column;}
    #shinkoku-exp .sakaeWrapper:first-of-type > div p { width: 100%; margin: 0;}
    #shinkoku-exp .sakaeWrapper:first-of-type > div table { width: 100%; margin: 5% 0 0;}
    #shinkoku-exp .sakaeWrapper:first-of-type > div table th,
    #shinkoku-exp .sakaeWrapper:first-of-type > div table td { padding: 1.2em 1em; display: table-cell; width: 30%;}
    #shinkoku-exp .sakaeWrapper:first-of-type > div table th:first-of-type { width: 70%;}
    #shinkoku-exp .sakaeWrapper:last-of-type { flex-direction: column; margin-top: 0;}
    #shinkoku-exp .sakaeWrapper:last-of-type div { width: 100%; margin-top: 5%;}
    #shinkoku-exp .sakaeWrapper:last-of-type div hr { margin: 1.5em 0;}
    #shinkoku-exp .sakaeWrapper:last-of-type div h6 { font-size: 4.2vw;}

    #shinkoku-faq li { padding: 1.2em;}
    #shinkoku-faq li:not(:last-of-type) { margin-bottom: 5%;}
    #shinkoku-faq li p span { font-size: 4.2vw;}
}


/*------------------------------------------------------------
	INFECTION
------------------------------------------------------------ */
.infection .read img { border: 2px solid #ccc; border-radius: 14px; margin-top: 5%;}

#infeCnts li { background: #fff; border-radius: 14px; border: 2px solid var(--bl1); margin: 0; padding: 3% 4% 4%;}
#infeCnts li h5 { color: var(--bl1); text-align: center;}
#infeCnts li img { border-radius: 10px; margin: 5% 0;}
#infeCnts li:nth-last-child(n+3) { margin-top: 4%;}

@media(max-width:767px) {
    #infeCnts li { padding: 6% 7% 7%;}
    #infeCnts li img { border-radius: 10px; margin: 5% 0;}
    #infeCnts li:nth-last-child(n+3) { margin-bottom: 4%;}
}


/*------------------------------------------------------------
	STAFF
------------------------------------------------------------ */
#stfpf { padding-top: 7%;;}
#stfpf .menu { padding: 3% 2% 2%; display: flex; align-items: center; justify-content: center; flex-wrap: wrap; background: rgba(255,255,255,.45); margin-top: 5%;}
#stfpf .menu a { display: block; margin: 0 0 1em; padding: .6em; color: var(--bl1); background: #fff; border-radius: 40px; width: 30%; text-align: center; border: 1px solid #fff; font-size: 20px;}
#stfpf .menu a:hover { border: 1px solid var(--bl1); color: var(--bl0);}

#stfpf.bg-w { background: #fff;}
#stfpf .sakaeWrapper { margin-top: 5%;}
#stfpf .sakaeWrapper h3 { font-size: 24px; color: var(--bl1); border-bottom: 1px solid var(--bl1); padding: 0 0 .5em; text-align: center;}
#stfpf .sakaeWrapper h4 { text-align: center; margin-bottom: .8em;}
#stfpf .sakaeWrapper > div { display: flex; align-items: flex-start; justify-content: space-between; flex-wrap: wrap; margin-bottom: 4%;}
#stfpf .sakaeWrapper > div > div { width: 48.5%; margin: 3% 0 0; padding: 1.5em; border-radius: 16px;}
#stfpf .pM { background: #e6f4fc;}
#stfpf .pF { background: #ffefef;}
#stfpf .sakaeWrapper img { width: 90%; margin: .5em auto 5%;}
#stfpf .sakaeWrapper > div > div div { padding: .5em 1em; background: #fff;}
#stfpf .sakaeWrapper dl { font-size: 16px; padding: .6em .5em; border-bottom: 1px solid #ccc; display: flex; flex-wrap: wrap;}
#stfpf .sakaeWrapper dt { width: 36%; border-right: 1px solid #ccc; padding-right: .6em;}
#stfpf .sakaeWrapper dd { width: 64%; padding-left: 1em; }
#stfpf .sakaeWrapper dl:last-of-type dd { padding: .5em 0 0; }
#stfpf .sakaeWrapper > div > div div dl:last-of-type { border: 0;}
#stfpf .sakaeWrapper > div > div div dl:last-of-type dt,
#stfpf .sakaeWrapper > div > div div dl:last-of-type dd { width: 100%; border: 0;}

#stfpf .sakaeWrapper > a { display: block; width: 50%; margin: .5em auto 1em; padding: .8em 1em; background: var(--pp1); color: #fff; text-align: center; border-radius: 40px; font-size: 20px; }
#stfpf .sakaeWrapper > a:hover { background: var(--pp2);}
#stfpf #kanto > a { width: 40%;}
.staff-pf .cmnInf { margin-top: 0;}

@media(max-width:880px) {
    #stfpf .menu { padding: 5% 2% 3%; margin-top: 8%;}
    #stfpf .menu a { margin: 0 auto .8em; padding: .4em; width: 80%; font-size: 1.6rem;}

    #stfpf .sakaeWrapper { margin-top: 10%;}
    #stfpf .sakaeWrapper h3 { font-size: 2rem; padding: 0 0 .5em;}
    #stfpf .sakaeWrapper h4 { font-size: 1.6rem; margin-bottom: .8em;}
    #stfpf .sakaeWrapper > div { margin-bottom: 5%;}
    #stfpf .sakaeWrapper > div > div { width: 100%; margin: 5% 0 0; padding: 1em; border-radius: 16px;}
    #stfpf .sakaeWrapper img { width: 80%; }
    #stfpf .sakaeWrapper dl { font-size: 16px; line-height: 1.4; padding: .8em .3em;}
    #stfpf .sakaeWrapper dt { width: 30%; }
    #stfpf .sakaeWrapper dd { width: 70%; }

    #stfpf .sakaeWrapper > a { width: 80%; margin-top: .5em; padding: .6em 1em; font-size: 1.8rem;}
}
@media(max-width:767px) {
    #stfpf .sakaeWrapper dl { font-size: 1.3rem;}
}


/*------------------------------------------------------------
	COMPANY - TERMS
------------------------------------------------------------ */
.companymain, .terms .termsCnt { padding: 7% 0;}
.companymain .sakaeWrapper { width: 60%; margin: 3% auto 0;}
.company th, .company td { padding: 1em 1.2em; border: 1px solid #999;}
.company th { background: #f0f0f0;}
.company td { background: #fff;}

.terms .termsCnt > h4 { text-align: center;}
.terms .termsCnt .sakaeWrapper { width: 60%; height: auto; margin: 4% auto 0; padding: 3% 4%; background: #fff; border: 1px solid #999;}
.terms .termsCnt .sakaeWrapper h5 { padding-bottom: .5em; margin-bottom: .6em; border-bottom: 1px solid #ccc;}
.terms .termsCnt .sakaeWrapper .indt { text-indent: -1.7em; padding-left: 1.7em; margin-top: .6em;}

@media(max-width:767px) {
    .companymain .sakaeWrapper { width: 90%; margin: 5% auto 0;}
    .company th, .company td  { display: block; width: 100%; text-align: center;}
    .company tr:first-of-type th  { border-top: 1px solid #999;}
    .company th  { border-top: 0;}
    .company td  { border-top: 0;}
    .terms .termsCnt .sakaeWrapper { width: 90%; padding: 5% 6%; margin-top: 5%;}
}


/*------------------------------------------------------------
	CONTACT
------------------------------------------------------------ */
form th, form td { vertical-align: top;}
#contactPage dl { display: flex; justify-content: center; margin-top: 3%;}
#contactPage dt, #contactPage dd { width: 32%; margin: 0 1%; padding: 1.5em 20px; background: #fff; border-top: 5px solid #fff;}
#contactPage dl h3 { font-size: 2vw; line-height: 1.2; text-align: center; margin-bottom: .8em; font-family: 'Noto Sans JP', sans-serif; letter-spacing: 0;}
#contactPage dl h3 i { margin-right: 10px; font-size: calc(1em + 2px);}
#contactPage dl p { color: #555;}
#contactPage dt { border-color: var(--line);}
#contactPage dt h3 { color: var(--line); display: flex; align-items: center; justify-content: center; line-height: 1;}
#contactPage dt h3 img { width: 28px; margin:0 10px 0 0;}
#contactPage dt div { display:flex; justify-content: center; align-items: center; }
#contactPage dt h5 { font-size: 1.5vw; color: #666; line-height: 1.3;}
#contactPage dt a { margin: 0 0 0 5%; max-width: 45%;}
#contactPage dt a img { margin: 0; width: 100%;}
#contactPage dd { border-color: var(--tel);}
#contactPage dd h3 { color: var(--tel); }
#contactPage dd h4 { color: var(--tel); font-size: 3vw; font-weight: bold; line-height: 1; text-align: center;}

form article > h3 { text-align: center; color: var(--bl1); font-weight: 700; margin-bottom: .4em;}
#sm-subsc { margin-top: 10%;}
.page-template-page-contact-confirm form article > h3 { display: none;}
.contact-error-smart #sm-subsc,
.page-template-page-contact-confirm #sm-subsc { margin-top: 0;}


#sm-subsc td > div { border: 1px solid #999; margin: 4% auto 0; width: 100%;}
#sm-subsc td div > h5 { text-align: center; color: #555; border-bottom: 1px solid #999; margin: 0; padding: 1.2em 0; line-height: 1;}
#sm-subsc td div > div { display: flex; align-items: center; justify-content: center; padding: 2em;}
#sm-subsc td div > div img { width: 35%; margin: 0 0 0 1em;}
#sm-subsc td div > h5,
#sm-subsc td div > div h4 { font-size: 18px;}
#sm-subsc td div > div h4 { line-height: 1.7; margin: 0;}
#sm-subsc td div > div h4 i { margin-right: .4em;}
#sm-subsc td div > div h4 span { font-size: 15px; display: block; font-weight: normal; color: #555; line-height: 1.4; margin-top: .4em;}
.contact-confirm-smart #sm-subsc td > div { display: none;}
.contact-confirm-smart #sm-subsc td > div.mw-wp-form_image { display: block; margin: 0; border-color: #ccc;}

.mnsk-check input[type="checkbox"] {
    -webkit-appearance: none;
    position: relative;
    margin-right: 5px;
    border-radius: 3px;
    border: 1px solid #999;
    box-sizing: border-box;
    width: 20px;
    height: 20px;
    background:#fff;
    vertical-align: top;
    transition: all .2s ease-in-out;
}
.mnsk-check input[type="checkbox"]:checked { background:var(--red1); }
.mnsk-check input[type="checkbox"]:checked:before {
    position: absolute;
    left: 2px;
    top: 2px;
    display: block;
    content: "\f00c";
    font-family: FontAwesome;
    font-size:14px;
    color:#fff;
}
.mnsk-check { position:relative; cursor:pointer; display:block; margin-top: 4%; text-align: center; color: #059b42;}
.mnsk-check > span { display: block; margin: 0 auto; text-align: center; }
.mnsk-check > span .mwform-checkbox-field-text { color: #059b42;}

.forms .apdf { text-align: center; margin-top: 6%;}
.forms .apdf a { display: inline-block; padding: .6em 1.2em .8em 1.6em; color: #059b42; border: 1px solid #059b42; line-height: 1;}
.forms .apdf a:hover { background: #e4f2e5;}
.forms .apdf a i { font-size: calc(1em + 6px); margin-right: .2em;}

@media(min-width:1300px) {
    #contactPage dl h3 { font-size: 24px;}
    #contactPage dt h5 { font-size: 20px;}
    #contactPage dt h6 span { font-size: 16px;}
    #contactPage dd h4 { font-size: 38px; }
}
@media(max-width:800px) {
    #contactPage dl { flex-direction: column;}
    #contactPage dt, #contactPage dd { width: 100%; padding: 1em 1.4em; margin-bottom: 4%;}
    #contactPage dl h3 { font-size: 2rem;}
    #contactPage dt h3 img { width: 25px; margin:0 8px 0 0;}
    #contactPage dt h5 { font-size: 3.2vw; line-height: 1.4;}
    #contactPage dt a { width: 33%; max-width: 100px;}
    #contactPage dd h4 { font-size: 8vw; margin-bottom: .4em;}
    #sm-subsc td div > div { flex-direction: column;}
    #sm-subsc td div > div img { width: 80%; margin: 2% auto 0;}
    #sm-subsc td div > h5,
    #sm-subsc td div > div h4 { font-size: 1.7rem;}
    #sm-subsc td div > div h4 span { font-size: 1.4rem; margin-top: .4em;}
    .mnsk-check { margin-top: 10%;}
    .forms .apdf { margin-top: 10%;}

}


/*------------------------------------------------------------
	author
------------------------------------------------------------ */
#blogs li .author_name { font-size: 12px; padding: 3px 4px; line-height: 1; color: #fff; background: #d0aa6e; border: 0; margin: 0; display: inline-block; text-align: left;}
.authors,
.uds .content-area { width: calc(100% - 300px); background:}
.uds.user-postlist .content-area { width: calc(100% - 300px); background: rgba(255,255,255,.7); padding: 2.5em;}
.authors li { display: flex; justify-content: space-between; align-items: flex-start; flex-direction: column; background: rgba(255,255,255,.7); margin-bottom: 2%; padding: 0;}
.authors li > div { padding: 1.4em 1.8em 1.8em; width: 100%;}
.authors li > div .btns { margin-top: 1.5em;}
.authors li h3, .authors li h6 { color: #664f26;}
.authors li h6 { font-size: 15px;}
.authors li h3 { font-size: 22px; border-bottom: 1px solid #664f26; padding-bottom: .6em; margin-bottom: .6em;}
.authors li p { font-size: 13px;}
.authors li img, .authors li a { width: 100%; }
.authors li img { height: auto; margin:0}
.authors li a { font-size: 14px; margin: 0; padding: .8em 1em 1em; line-height: 1.4;}

.author-info { display: flex; justify-content: space-between; align-items: flex-start;}
.author-info > img { width: 35%; height: auto; margin: 0;}
.author-info > div { width: 60%;}
.author-info h3, .author-info h6 { color: #664f26;}
.author-info h6 { border-bottom: 1px solid #664f26; padding-bottom: .6em; margin-bottom: .6em;}
.author-info p { font-size: 14px;}
.author-info div > img { display: none;}
.author-profile div:nth-child(1) > img { display: none;}

.author #blogs { margin-top: 5%; padding-top: 5%; border-top: 1px solid #d0aa6e;}
.author #blogs li { background: #f8f2e9;}
.author #blogs li > a div { background: #f8f2e9; padding: 1.2em 1.5em 1.4em;}
.author #blogs li .date { color: #dfc49a;}
.author #blogs li h5 { font-size: 18px; line-height: 1.4; margin:.4em 0 .3em; color: #664f26;}
.author #blogs li p { font-size: 14px; line-height: 1.5;}
.author #blogs li p.author_name { font-size: 11px; line-height: 1;}

@media(max-width:767px) {
    .authors,
    .uds .content-area,
    .uds.user-postlist .content-area { width: 100%;}
    .uds .content-area,
    .uds.user-postlist .content-area { padding: 2em;}
    .category section.uds,
    .author section.uds,
    .stafflist section.uds { padding-top: 5%;}
    .authors li { width: 48%; margin-bottom: 4%;}
    .authors li > div { padding: 1em 1.3em 1.3em;}
    .authors li > div .btns { margin-top: 1em;}
    .authors li h6 { font-size: 1.3rem;}
    .authors li h3 { font-size: 1.8rem; padding-bottom: .4em; margin-bottom: .4em;}
    .authors li p { font-size: 1.2rem;}
    .authors li a { font-size: 1.3rem; margin: 0;}

    .author-info { flex-direction: column-reverse;;}
    .author-info > img, .author-info > div { width: 100%;}
    .author-info > img { margin: 0 0 5%;}
    .author-info li > img { display: block; width: 100%; height: auto; margin: 5% 0;}
    .author #blogs { margin-top: 10%; padding: 0; border: 0;}
    .author #blogs li:not(:last-of-type) { margin-bottom: 5%;}
    .author #blogs li h5 { font-size: 1.4rem; line-height: 1.4; margin:.4em 0 0;}
    .author #blogs li p { font-size: 1.2rem; line-height: 1.4; margin:0;}
    .author #blogs li p.author_name { font-size: 1rem;}
}


/*------------------------------------------------------------
	CMN INSO
------------------------------------------------------------ */
.linebnr { width: 100%; display: flex; align-items: center; justify-content: center; margin: 5% 0;}
.linebnr img { margin: 0;}
.linebnr.ft { background: #fff; padding: 5%; margin: 0 0 0;}

.contactbnrs { padding: 5% 10%; background: #fff; display: flex; justify-content: center;}
.contactbnrs a { width: 46%; display: block;}
.contactbnrs a:nth-of-type(even) { margin-left: 2%;}
.contactbnrs a:nth-of-type(odd) { margin-right: 2%;}

body.home .linebnr.ft,
body.blog .linebnr.ft,
body.archive .linebnr.ft,
body#infeCnts .linebnr.ft,
body.m-and-a .linebnr.ft,
body.staff .linebnr.ft {margin: 0;}
body.single .linebnr.ft { margin-top: 5%;}
.cmnInf { padding: 2% 0 4%; margin: 0;}
.cmnInf .sakaeWrapper { margin-top: 0;}
.cmnInf .cminf--readbox {
    background-image: url(images/common/cvill_l.png),url(images/common/cvill_r.png);
    background-position: 0 5%, 100% 5%;
    background-size: 151px;
    background-repeat: no-repeat;
    margin-bottom: 2.5%;
    min-height: 180px;
    display: flex; flex-direction: column; justify-content: center;
}
.cmnInf .cminf--readbox h2 { text-align: center; color: var(--bl1); margin-bottom: .4em; font-weight: 700;}
.cmnInf .cminf--readbox h4 { text-align: center; margin-bottom: 1em; font-weight: 500; color: var(--bl0);}
.cmnInf .cminf--readbox p { text-align: center;}

.cmnInf li { padding: 1.5em 20px; margin: 0; background: #fff; border-top: 5px solid #fff;}
.cmnInf li h3 { font-size: 2vw; line-height: 1.2; text-align: center; margin-bottom: .8em;}
.cmnInf li h3 i { margin-right: 10px; font-size: calc(1em + 2px);}

.cmnInf li.ifL { border-color: var(--line); padding: 0;}
.cmnInf li.ifL h3 { color: var(--line); display: flex; align-items: center; justify-content: center; line-height: 1; }
.cmnInf li.ifL h3 img { width: 28px; margin:0 10px 0 0;}
.cmnInf li.ifL div { display:flex; justify-content: space-between; align-items: flex-start; flex-wrap: wrap;}
.cmnInf li.ifL h6 { width: 45%; font-size: 1.4vw;}
.cmnInf li.ifL img { margin: 0; width: 50%;}
.cmnInf li.ifL p { display: block; margin-top: .6em; text-align: center; width: 100%;}
.cmnInf li.ifL .puBtn { display: block; height: 100%; cursor: pointer; padding: 1.5em 20px; transition: all .2s ease-in-out;}
.cmnInf li.ifL .puBtn:hover { background: rgba(0,185,1,.15);}

.cmnInf li.ifT { border-color: var(--tel);}
.cmnInf li.ifT h3 { color: var(--tel); }
.cmnInf li.ifT h4, .cmnInf li.ifT p { text-align: center;}
.cmnInf li.ifT h4 { color: var(--tel); font-size: 3vw; line-height: 1; margin-bottom: .4em;}

.cmnInf li.ifF { border-color: var(--pp1); }
.cmnInf li.ifF h3 { color: var(--pp1); }
.cmnInf li.ifF a { display: block; width: 100%; margin: 0; background: var(--pp1); padding: .4em .5em .6em; color: #fff; border-radius: 30px; font-weight: 500; font-size: 1.6vw;}
.cmnInf li.ifF a:hover { opacity: .7;}
.cmnInf li.ifF p { text-align: center; margin-top: .8em;}

@media(min-width:1100px) {
    .cmnInf li h3 { font-size: 24px;}
    .cmnInf li.ifT h4 { font-size: 38px; }
    .cmnInf li.ifL h6 { font-size: 16px;}
    .cmnInf li.ifF a { font-size: 18px;}
}

@media(max-width:767px) {
    .linebnr { margin: 8% 0;}
    .linebnr img { max-width: 78%; margin: 0 auto;}
    .linebnr.ft { padding: 8%;}

    .contactbnrs { padding: 8% 10%; flex-direction: column;}
    .contactbnrs a { width: 100%;}
    .contactbnrs a:nth-of-type(even) { margin: 5% 0 0;}
    .contactbnrs a:nth-of-type(odd) { margin: 0;}
        
    body.single .linebnr.ft { margin-top: 10%;}
    .cmnInf { padding: 10% 0 3%;}
    .cmnInf .cminf--readbox { flex-direction: column; margin-bottom: 5%;  background-position: 0 0, 100% 0; background-size: 13%;}
    .cmnInf .cminf--readbox > div { width: 100%;}
    .cmnInf .cminf--readbox h2 { text-align: center; padding: 0; font-size: 4.6vw;}
    .cmnInf .cminf--readbox h4 { text-align: center; margin-bottom: .6em; font-size: 3.6vw;}
    .cmnInf .cminf--readbox img { width: 60%; margin: 0 0 4%;}
    .cmnInf > p { font-size: 3.2vw;}
    .cmnInf ul { margin-top: 6%;}
    .cmnInf li { width: 100%;}
    .cmnInf li { padding: 1em 1.4em; margin-bottom: 4%;}
    .cmnInf li h3 { font-size: 2rem;}
    .cmnInf li.ifL h3 img { width: 25px; margin:0 8px 0 0;}
    .cmnInf li.ifL div { justify-content: center;}
    .cmnInf li.ifL h6 { width: auto; font-size: 3vw; line-height: 1.4; margin: 0 .5em;}
    .cmnInf li.ifL img { width: auto; max-width: 100px; margin: 0 .5em;}
    .cmnInf li.ifT h4 { font-size: 9vw; margin-bottom: .4em;}
    .cmnInf li.ifF a { font-size:4.5vw;}
}

/*------------------------------------------------------------
	POP UP
------------------------------------------------------------ */
.popup_wrap input {
  display: none;
}

.popup_overlay {
  display: flex;
  justify-content: center;
  overflow: auto;
  position: fixed;
  top: 0;
  left: 0;
  z-index: 9999;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.7);
  opacity: 0;
  transition: opacity 0.5s, transform 0s 0.5s;
  transform: scale(0);
}

.popup_trigger {
  position: absolute;
  width: 100%;
  height: 100%;
}

.popup_content {
  position: relative;
  align-self: center;
  width: 90%;
  max-width: 880px;
  padding:6% 4% 5%;
  box-sizing: border-box;
  border-radius: 10px;
  background: #fff;
  transition: 0.5s;
}

.close_btn {
    position: absolute;
    top: 14px;
    right: 16px;
    font-size: 40px;
    cursor: pointer;
    padding: 0;
    line-height: 1;
    color: #444;
}

.popup_wrap input:checked ~ .popup_overlay {
  opacity: 1;
  transform: scale(1);
  transition: opacity 0.5s;
}

.puBtn {
  position: relative;
  cursor: pointer;
  display: block;
  transition: .3s ease;
}
label img { transition: all .2s ease-in-out;}
label:hover img { opacity: .8;}

.popup_content a { position: relative; display: block; background: var(--line); border-radius: 6px; padding: .6em 1em; margin: 2.2% 0 0; color: #fff; font-weight: bold; width: 23.5%;}
.popup_content a:hover { background: #117a12;}
.popup_content a::after {
content: "\f105";
font-family: FontAwesome;
position: absolute;
top: 50%;
left: inherit;
right: 3%;
transform: translate(-50%,-50%);
transition: all .2s ease-in-out;
color: #fff;
display: block;
border: 0;
height: auto;
}
.popup_content .puplinkwrap { display: flex; justify-content: space-between; flex-wrap: wrap;}

@media(max-width:767px) {
    .popup_content { padding: 10% 8% 7%; }
    .popup_content a { margin: 6% 0 0; width: 47%;}
}


/*------------------------------------------------------------
	footer
------------------------------------------------------------ */
footer { position:relative; padding:5% 0 0; background: rgba(255,255,255,.6);}

footer .sakaeWrapper { display: flex; justify-content: space-between; margin-top: 0;}
footer .sakaeWrapper > ul { width: 37%;}
footer .sakaeWrapper > ul li { margin-bottom: .6em;}
footer .sakaeWrapper > ul a { color: var(--bl1); font-size: 1.2vw; font-weight: 500; display: inline-block;}
footer .sakaeWrapper > ul a i { font-size: calc(1em + 2px); margin-right: .3em;}
footer .sakaeWrapper > ul a:hover { opacity: .8; padding-left: .5em;}

footer .ft-store { width: 60%;}
footer .ft-store h5 { text-align: center; padding-bottom: .5em; margin-bottom: 1em; border-bottom: 1px solid var(--bl0); color: var(--bl0);}
footer .ft-store li { display: flex; align-items: center; margin-bottom: 1em;}
footer .ft-store li a, footer .ft-store li h6 { font-size: 1.2vw; display: block;}
footer .ft-store li h6 { margin-left: .8em; color: var(--bl0);}
footer .ft-store li a { color: #fff; font-weight: 500; width: 18%; border-radius: 6px; background: var(--bl0); text-align: center; padding: .4em .4em .6em; line-height: 1;}
footer .ft-store li a:hover { background: var(--bl1);}

footer .r18txt { width: 90%; text-align: center; margin: 5em auto 0;}
footer .r18txt span { display: inline-block; padding: .7em 2em .8em; text-align: center; color: #fff; background: #aaa; border-radius: 100px; font-size: 14px;}
footer .cpy { text-align: center; font-size: 12px; color: #fff; margin-top: 5em; padding: .8em 1em; background: var(--bl2);}

.fx-contactBx { position: fixed; top: 110px; right: -2px; z-index: 999; padding: 20px; border-top-left-radius: 10px; border-bottom-left-radius: 10px; background: #f0f0f0; border: 2px solid #fff; max-width: 104px;}
.fx-contactBx div { display: flex; justify-content: center; align-items: center; flex-direction: column;}
.fx-contactBx div a:not(:first-of-type) { margin-top: 1em;}

@media(max-width:767px) {
    footer { padding:8% 0 80px;}
    footer .sakaeWrapper { flex-wrap: wrap;}
    footer .sakaeWrapper > ul { width: 100%;}
    footer .sakaeWrapper > ul a { font-size: 4vw;}
    footer .ft-store { width: 100%;}
    footer .ft-store h5 { text-align: center; padding: .5em 0; border-top: 1px solid var(--bl1); margin-top: 1.5em;}
    footer .ft-store li { margin-bottom: 1em;}
    footer .ft-store li a, footer .ft-store li h6 { font-size: 4vw; line-height: 1.3;}
    footer .ft-store li h6 { width: 72%;}

    footer .ft-store li a { width: 25%; padding: .6em .4em .8em;}
    footer .r18txt { margin-top: 8%;}
    footer .r18txt span { font-size: 3vw; border-radius: 8px; padding: .8em 1.4em .9em;}
    footer .cpy { margin-top: 6%; font-size: 2.8vw;}

    .fx-contactBx { width: 100%; border-radius: 0; top: inherit; right: inherit; bottom: 0; box-shadow: none; max-width: 100vw; background: var(--bl3); padding: 0;}
    .fx-contactBx div { height: 80px; flex-direction: row;}
    .fx-contactBx div a { max-width: 52px;}
    .fx-contactBx div a:not(:first-of-type) { margin: 0 0 0 1em;}
}