@charset "utf-8";

:root{
    --base-font: "Noto Sans JP", sans-serif;
    --zen-old: "Zen Old Mincho", serif;
    
    --base-font-color: #1A1A1A;
    --navy: #002144;
    --blue: #004282;
    --gray: #C4C4C5;
    --darkgray: #9EA0A8;
    --lightgray: #F0F2F4;
    --vividred: #cf2e2e;

    --comp-660: 89.1891891891891vw;
    --comp-580: 78.3783783783783vw;
    --comp-540: 72.9729729729729vw;
    --comp-520: 70.2702702702702vw;
    --comp-500: 67.5675675675675vw;
    --comp-480: 64.8648648648648vw;
    --comp-400: 54.054054054054vw;
    --comp-360: 48.6486486486486vw;
    --comp-350: 47.2972972972972vw;
    --comp-340: 45.9459459459459vw;
    --comp-300: 40.5405405405405vw;
    --comp-280: 37.83783783783784vw;
    --comp-260: 35.1351351351351vw;
    --comp-250: 33.7837837837837vw;
    --comp-240: 32.4324324324324vw;
    --comp-200: 27.027027027027vw;
    --comp-195: 26.3513513513513vw;
    --comp-190: 25.6756756756756vw;
    --comp-185: 25vw;
    --comp-180: 24.3243243243243vw;
    --comp-175: 23.6486486486486vw;
    --comp-170: 22.9729729729729vw;
    --comp-165: 22.2972972972972vw;
    --comp-160: 21.6216216216216vw;
    --comp-155: 20.9459459459459vw;
    --comp-150: 20.2702702702702vw;
    --comp-145: 19.5945945945945vw;
    --comp-140: 18.9189189189189vw;
    --comp-135: 18.2432432432432vw;
    --comp-130: 17.5675675675675vw;
    --comp-125: 16.8918918918918vw;
    --comp-120: 16.2162162162162vw;
    --comp-115: 15.5405405405405vw;
    --comp-110: 14.8648648648648vw;
    --comp-105: 14.1891891891891vw;
    --comp-100: 13.5135135135135vw;
    --comp-95: 12.83783783783783vw;
    --comp-90: 12.1621621621621vw;
    --comp-85: 11.48648648648648vw;
    --comp-80: 10.8108108108108vw;
    --comp-75: 10.13513513513513vw;
    --comp-70: 9.459459459459459vw;
    --comp-65: 8.738738738738738vw;
    --comp-60: 8.108108108108108vw;
    --comp-55: 7.432432432432432vw;
    --comp-50: 6.756756756756756vw;
    --comp-45: 6.081081081081081vw;
    --comp-40: 5.405405405405405vw;
    --comp-35: 4.729729729729729vw;
    --comp-30: 4.054054054054054vw;
    --comp-25: 3.378378378378378vw;
    --comp-20: 2.702702702702702vw;
    --comp-15: 2.027027027027027vw;
    --comp-10: 1.351351351351351vw;
    --comp-5: 0.6756756756756756vw;
    
    --comp-68: 9.189189189189189vw;
    --comp-62: 8.378378378378378vw;
    --comp-58: 7.837837837837837vw;
    --comp-56: 7.567567567567567vw;
    --comp-54: 7.297297297297297vw;
    --comp-52: 7.027027027027027vw;
    --comp-48: 6.486486486486486vw;
    --comp-46: 6.216216216216216vw;
    --comp-44: 5.945945945945945vw;
    --comp-42: 5.675675675675675vw;
    --comp-39: 5.270270270270270vw;
    --comp-38: 5.135135135135135vw;
    --comp-36: 4.864864864864864vw;
    --comp-34: 4.594594594594594vw;
    --comp-33: 4.459459459459459vw;
    --comp-32: 4.324324324324324vw;
    --comp-28: 3.783783783783783vw;
    --comp-27: 3.648648648648648vw;
    --comp-26: 3.513513513513513vw;
    --comp-24: 3.243243243243243vw;
    --comp-22: 2.972972972972972vw;
    --comp-21: 2.837837837837837vw;
    --comp-19: 2.567567567567567vw;
    --comp-18: 2.432432432432432vw;
    --comp-17: 2.297297297297297vw;
    --comp-16: 2.162162162162162vw;
    --comp-14: 1.891891891891891vw;
    --comp-13-5: 1.82432432432432432vw;
    --comp-12: 1.621621621621621vw;
    --comp-8: 1.08108108108108108vw;
    --comp-7: 0.94594594594594594vw;
    --comp-4: 0.54054054054054054vw;
    --comp-3: 0.40540540540540540vw;
}

@media screen and (-webkit-min-device-pixel-ratio: 0) and (min-resolution: .001dpcm) {
	img {
		image-rendering: -webkit-optimize-contrast !important;
	}
}

body{ margin:0 auto; padding:0; font-display: auto; -webkit-font-smoothing: antialiased !important; font-smoothing: antialiased !important; color: var(--base-font-color); letter-spacing: 0.03em; width: 100%; letter-spacing: 0.07em; animation: openingFadeIn 1.5s ease forwards; animation-delay: 0.3s; opacity: 0;}
img{ border:none; vertical-align:bottom; -webkit-backface-visibility: hidden; width: 100%; height: auto; max-width: 100%;}
ul{ list-style:none; margin:0; padding:0;}
p{ margin:0; line-height: 2.5; font-size: min(var(--comp-24), 16px); font-family: var(--base-font); color: var(--navy);}
.nowrap{ text-wrap: nowrap; display: inline-block;}

/* IE8+, Chrome  */
a{ transition: all ease 0.5s; outline: 0;}

@media (any-hover: hover) {
    a:hover{ opacity: 0.7;}
}

@media screen and (width > 800px){
.sp{ display: none !important;}
}
    
@media screen and (width <= 800px){
.pc{ display: none !important;}
}

/* Firefox */
a::-moz-focus-inner,
a::-moz-focus-inner { border: 0;}

/*----------------------------------------------

COMMON

----------------------------------------------*/

/*
 HEADER
--------------------------------*/
header{ position: relative; height: 0; z-index: 1000;}
header .wrapHeader{ height: calc(min(var(--comp-30), 30px) + min(var(--comp-30), 30px) + min(var(--comp-90), 60px)); padding: 0 calc(min(var(--comp-30), 30px) + min(var(--comp-90), 60px)) 0 min(var(--comp-30), 30px); display: flex; flex-direction: column; justify-content: center;}
header .innerHeader{ display: flex;}
header .innerHeader h1{ width: min(var(--comp-360), 300px);}
header .innerHeader h1 a{ aspect-ratio: 300000 / 76953; width: 100%; background-image: url(../img/common/logo.svg); background-repeat: no-repeat; background-position: center center; background-size: contain; display: block;}
header .innerHeader .innerHeaderNav{ width: calc(100% - min(var(--comp-360), 300px)); display: flex; flex-wrap: wrap; justify-content: flex-end; align-items: center; }
header .innerHeader .navList{ display: flex; pointer-events: all; transition: padding 0.5s ease; gap: min(var(--comp-30), 30px); margin-right: min(var(--comp-45), 45px);}
header .innerHeader .navList > li{ position: relative; }
header .innerHeader .navList > li:last-child{ padding-right: 0;}
header .innerHeader .navList > li > button,
header .innerHeader .navList > li > a{ display: block; position: relative; touch-action:manipulation; padding: min(var(--comp-35), 35px) 0; font-family: var(--zen-old); font-weight: 500; color: var(--navy); font-size: min(var(--comp-24), 16px) ; letter-spacing: 0.2em; line-height: 1;}
header .innerHeader .navList > li > button::after,
header .innerHeader .navList > li > a::after{ content: ""; display: block; width: 100%; height: 1px; position: absolute; top: calc(min(var(--comp-35), 35px) + 1.5em); left: 50%; background-color: var(--navy); transition: all 0.5s ease; transform: translateX(-50%) scaleX(0);}
header .innerHeader .navList > li > .navSubList{ position: absolute; left: calc(50% - (250px / 2)); transition: opacity ease 0.6s; opacity: 0; pointer-events: none; box-sizing: border-box; background-color: #fff; font-family: var(--zen-old); font-weight: 500; display: block; padding: min(var(--comp-30), 30px) min(var(--comp-30), 30px) min(var(--comp-30), 30px); width: 250px;}
header .innerHeader .navList > li > .navSubList li{ display: block; width: 100%; transform: none !important; position: relative;}
header .innerHeader .navList > li > .navSubList li:not(:last-child){ margin-bottom: min(var(--comp-10), 10px);}
header .innerHeader .navList > li > .navSubList li > a,
header .innerHeader .navList > li > .navSubList li > span{ color: var(--navy); line-height: 1.6; font-size: min(var(--comp-22), 14px); border-bottom: 1px solid #D8D8D8; padding-bottom: min(var(--comp-10), 10px); width: 100%; display: block; position: relative;}
header .innerHeader .navList > li > .navSubList li > a::before{ content: ""; display: block; height: 1px; position: absolute; bottom: -1px; left: 0; transform: scaleX(0); transform-origin: top right; transition: transform 0.7s ease; background-color: var(--navy); width: 100%;}
header .innerHeader .navList > li > .navSubList li > ul{ padding-left: min(var(--comp-30), 30px); margin-top: min(var(--comp-10), 10px); display: block; }
header .innerHeader .navList > li > .navSubList li > ul > li:not(:last-child){ margin-bottom: min(var(--comp-10), 10px)}
header .innerHeader .headerCvList{ display: flex; width: clamp(450px, 38vw, 640px);}
header .innerHeader .headerCvList li{ flex: 1;}
header .innerHeader .headerCvList li a{ display: block; text-align: center; color: #fff; font-family: var(--zen-old); width: 100%; height: 100%; display: flex; flex-direction: column; align-items: center; justify-content: center; font-size: min(var(--comp-21), 15px); height: min(var(--comp-90), 60px); text-wrap: nowrap; font-feature-settings: "palt"; letter-spacing: 0.02em;}
header .innerHeader .headerCvList li:nth-child(1) a{ background-color: #004282;}
header .innerHeader .headerCvList li:nth-child(2) a{ background-color: #0063BE;}
header .innerHeader .headerCvList li:nth-child(3) a{ background-color: #1C8BF3;}
header .innerHeader .headerCvList li:nth-child(4) a{ background-color: #4EAAF7;}
header .innerHeader .headerCvList li .nowrap{ text-wrap: nowrap;}

@media (any-hover: hover) {
header .innerHeader .navList > li > button:hover + .navSubList,
header .innerHeader .navList > li > .navSubList:hover{ opacity: 1 !important; pointer-events: all;}
header .innerHeader .navList > li > a:hover{ opacity: 1;}
header .innerHeader .navList > li > button:hover::after,
header .innerHeader .navList > li > a:hover::after,
header .innerHeader .navList > li > button:has(+ .navSubList:hover)::after { transform: translateX(-50%) scaleX(100%);}
header .innerHeader .navList > li > button:hover + .navSubList li a,
header .innerHeader .navList > li > .navSubList:hover li a{ pointer-events: all; }
header .innerHeader .navList > li > .navSubList li > a:hover{ opacity: 1;}
header .innerHeader .navList > li > .navSubList li > a:hover::before{ transform: scaleX(100%); transform-origin: top left;}
}

@media (any-hover: none) {
header .innerHeader .navList > li > button:focus + .navSubList,
header .innerHeader .navList > li > .navSubList:focus{ opacity: 1 !important; pointer-events: all;}
header .innerHeader .navList > li > button:focus::after,
header .innerHeader .navList > li > a:focus::after,
header .innerHeader .navList > li > button:has(+ .navSubList:focus)::after { transform: translateX(-50%) scaleX(100%);}
}

@media screen and (width <= 1620px){
header .innerHeader .navList{ gap: min(var(--comp-20), 20px); margin-right: min(var(--comp-30), 30px);}
header .innerHeader .headerCvList{ display: flex; width: clamp(320px, 30vw, 450px);}
header .innerHeader .headerCvList li .nowrap{ text-wrap: nowrap; display: block; width: 100%;}
}

@media screen and (width <= 1380px){
header .innerHeader .headerCvList{ display: none;}
}

@media screen and (width <= 950px){
header .innerHeader .innerHeaderNav{ display: none; }
}

@media screen and (width <= 800px){
header{ position: relative; height: 0; z-index: 1000;}
header .wrapHeader{ height: calc(min(var(--comp-30), 30px) + min(var(--comp-30), 30px) + min(var(--comp-90), 60px)); padding: 0 calc(min(var(--comp-30), 30px) + min(var(--comp-90), 60px)) 0 min(var(--comp-30), 30px); display: flex; flex-direction: column; justify-content: center;}
header .innerHeader{ display: flex;}
header .innerHeader h1{ width: min(var(--comp-360), 300px);}
header .innerHeader h1 a{ aspect-ratio: 300000 / 76953; width: 100%; background-image: url(../img/common/logo.svg); background-repeat: no-repeat; background-position: center center; background-size: contain; display: block;}
header .innerHeader .innerHeaderNav{ display: none; }
}


/*
 NAVI
--------------------------------*/
#navi{ position: fixed; top: 0; left: 0;  width: 100%; height: 100dvh; z-index: 1000000; background-color: #002144; overflow-y: scroll; display: none;}
#navi::-webkit-scrollbar { background: #83858E; width: 5px; height: 5px;}
#navi::-webkit-scrollbar-thumb { background-color: var(--gray);}
#navi #wrapNavi{ padding: min(var(--comp-70), 120px) 0;}
#navi #wrapNavi #innerNavi{ width: min(var(--comp-580), 1280px); margin: 0 auto; display: flex;}
#navi #wrapNavi #innerNavi::before{ content: ""; display: block; order: 2; width: 1px; background-color: #83858E; margin-right: min(var(--comp-120), 120px);}
#navi #wrapNavi #innerNavi .wrapNaviText{ order: 1; width: 360px; }
#navi #wrapNavi #innerNavi .wrapNaviText .stickyBox{ position: sticky; top: min(var(--comp-20), 20px); left: 0;}
#navi #wrapNavi #innerNavi .wrapNaviText h1 a{ aspect-ratio: 300000 / 76953; width: 300px; background-image: url(../img/common/logo-w.svg); background-repeat: no-repeat; background-position: center center; background-size: contain; display: block;}
#navi #wrapNavi #innerNavi .wrapNaviText .innerNaviText{ margin: min(var(--comp-120), 80px) 0 0;}
#navi #wrapNavi #innerNavi .wrapNaviText .innerNaviText p{ color: #fff; font-family: var(--zen-old); font-weight: 500;}
#navi #wrapNavi #innerNavi .wrapNaviText .innerNaviText .access{ font-size: min(var(--comp-24), 16px); margin: 0 auto min(var(--comp-80), 50px); line-height: 2.1875;}
#navi #wrapNavi #innerNavi .wrapNaviText .innerNaviText .tel,
#navi #wrapNavi #innerNavi .wrapNaviText .innerNaviText .time{ display: flex; line-height: 1; align-items: baseline;}
#navi #wrapNavi #innerNavi .wrapNaviText .innerNaviText .tel{ margin: 0 auto min(var(--comp-30), 20px);}
#navi #wrapNavi #innerNavi .wrapNaviText .innerNaviText .tel .text{ font-size: min(var(--comp-54), 38px);}
#navi #wrapNavi #innerNavi .wrapNaviText .innerNaviText .navCvList{ display: flex; flex-wrap: wrap; margin: min(var(--comp-120), 85px) auto 0 0; width: min(100%, 300px); gap: min(var(--comp-30), 20px); font-family: var(--zen-old);}
#navi #wrapNavi #innerNavi .wrapNaviText .innerNaviText .navCvList li{ width: 100%;}
#navi #wrapNavi #innerNavi .wrapNaviText .innerNaviText .navCvList li a{ display: block; width: 100%; color: #fff; line-height: 1; padding: min(var(--comp-30), 20px); text-align: center;}
#navi #wrapNavi #innerNavi .wrapNaviText .innerNaviText .navCvList li:nth-child(1) a{ background-color: #004282;}
#navi #wrapNavi #innerNavi .wrapNaviText .innerNaviText .navCvList li:nth-child(2) a{ background-color: #0063BE;}
#navi #wrapNavi #innerNavi .wrapNaviText .innerNaviText .navCvList li:nth-child(3) a{ background-color: #1C8BF3;}
#navi #wrapNavi #innerNavi .wrapNaviText .innerNaviText .navCvList li:nth-child(4) a{ background-color: #4EAAF7;}
#navi #wrapNavi #innerNavi .innerNaviList{ order: 3; flex: 1; font-family: var(--zen-old); font-weight: 500; padding-bottom: min(var(--comp-40), 40px);}
#navi #wrapNavi #innerNavi .innerNaviList > ul > li{ border-bottom: 1px solid #83858E; }
#navi #wrapNavi #innerNavi .innerNaviList > ul > li a,
#navi #wrapNavi #innerNavi .innerNaviList > ul > li button{ line-height: 1.6; display: block; color: #fff; padding: min(var(--comp-35), 25px) 0; position: relative; font-size: min(var(--comp-30), 22px); box-sizing: border-box; width: 100%;}
#navi #wrapNavi #innerNavi .innerNaviList > ul > li button{ padding-right: min(var(--comp-90), 60px);}
#navi #wrapNavi #innerNavi .innerNaviList > ul > li button .icon{ display: block; position: absolute; top: calc(50% - (min(calc(var(--comp-30) - 1px), 21px) / 2)); right: min(var(--comp-30), 20px); width: min(calc(var(--comp-30) - 1px), 21px); height: min(calc(var(--comp-30) - 1px), 21px); transition: transform ease 0.5s;}
#navi #wrapNavi #innerNavi .innerNaviList > ul > li button .icon::before{ content: ""; display: block; width: 100%; height: 1px; position: absolute; top: calc(50% - 0.5px); left: 0; background-color: #fff;}
#navi #wrapNavi #innerNavi .innerNaviList > ul > li button .icon::after{ content: ""; display: block; width: 1px; height: 100%; position: absolute; left: calc(50% - 0.5px); top: 0; background-color: #fff; transition: transform ease 0.5s;}
#navi #wrapNavi #innerNavi .innerNaviList > ul > li button.active .icon{ transform: rotate(180deg);}
#navi #wrapNavi #innerNavi .innerNaviList > ul > li button.active .icon::after{ transform: scaleY(0); opacity: 0; }
#navi #wrapNavi #innerNavi .innerNaviList > ul > li > ul{ display: none; padding: min(var(--comp-20), 30px) 0 min(var(--comp-55), 55px) min(var(--comp-60), 60px);}
#navi #wrapNavi #innerNavi .innerNaviList > ul > li > ul > li{ width: 100%; margin-bottom: min(var(--comp-30), 20px);}
#navi #wrapNavi #innerNavi .innerNaviList > ul > li > ul > li:last-child{ margin-bottom: 0;}
#navi #wrapNavi #innerNavi .innerNaviList > ul > li > ul > li a{ font-size: min(var(--comp-25), 16px); padding: 0; display: inline;}

@media screen and (width <= 980px){
#navi #wrapNavi{ padding: min(var(--comp-70), 120px) 0 min(var(--comp-160), 120px);}
#navi #wrapNavi #innerNavi{ display: flex; flex-direction: column; flex-wrap: wrap;}
#navi #wrapNavi #innerNavi::before{ content: none;}
#navi #wrapNavi #innerNavi .wrapNaviText{ display: contents; }
#navi #wrapNavi #innerNavi .wrapNaviText .stickyBox{ display: contents;}
#navi #wrapNavi #innerNavi .wrapNaviText h1{ order: 1; margin-bottom: min(var(--comp-85), 85px);}
#navi #wrapNavi #innerNavi .wrapNaviText h1 a{ width: min(var(--comp-360), 300px);}
#navi #wrapNavi #innerNavi .wrapNaviText .innerNaviText{ order: 3;}
#navi #wrapNavi #innerNavi .wrapNaviText .innerNaviText .access{ font-size: min(var(--comp-24), 16px); margin: 0 auto min(var(--comp-80), 50px);}
#navi #wrapNavi #innerNavi .wrapNaviText .innerNaviText .tel,
#navi #wrapNavi #innerNavi .wrapNaviText .innerNaviText .time{ display: flex; line-height: 1; align-items: baseline;}
#navi #wrapNavi #innerNavi .wrapNaviText .innerNaviText .tel{ margin: 0 auto min(var(--comp-30), 20px);}
#navi #wrapNavi #innerNavi .wrapNaviText .innerNaviText .tel .text{ font-size: min(var(--comp-54), 38px);}
#navi #wrapNavi #innerNavi .wrapNaviText .innerNaviText .navCvList{ margin: min(var(--comp-120), 85px) auto 0 0; width: 100%; }
#navi #wrapNavi #innerNavi .innerNaviList{ order: 2; }
}


/*
 HAMBURGER
--------------------------------*/
#hamburger{ width: min(var(--comp-90), 60px); aspect-ratio: 1 / 1; position: fixed; z-index: 10000000; background-color: var(--navy); top: min(var(--comp-30), 30px); right: min(var(--comp-30), 30px); cursor: pointer;}
#hamburger .innerHamburger{ width: min(var(--comp-30), 20px); height: min(var(--comp-24), 15px); position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); }
#hamburger .innerHamburger .line{ display: block; width: 100%; height: 100%; position: relative; transition: all 0.5s ease;}
#hamburger .innerHamburger .line::before,
#hamburger .innerHamburger .line::after,
#hamburger .innerHamburger .line span{ content: ""; display: block; width: 100%; height: 1px; position: absolute; left: 0; background-color: #fff; transform: translateY(-50%); transition: all 0.5s ease;}
#hamburger .innerHamburger .line span{ top: 50%; }
#hamburger .innerHamburger .line::before{ top: 0;}
#hamburger .innerHamburger .line::after{ top: calc(100% + 1px); }
#hamburger.active{ outline: 1px solid #83858E;}
#hamburger.active .innerHamburger .line span{ transform: translateY(-50%) scaleX(0); opacity: 0;}
#hamburger.active .innerHamburger .line::before{ top: 50%; transform: translateY(-50%) rotate(135deg); }
#hamburger.active .innerHamburger .line::after{ top: 50%; transform: translateY(-50%) rotate(45deg); }


@media screen and (width <= 800px){
#hamburger{ background-color: rgb(0 33 68 / 0.6);}
}

/*
 CV BOX
--------------------------------*/
#cvBox{ background-image: url(../img/common/bg-texture-04.jpg); background-repeat: repeat; background-position: center top; padding: min(var(--comp-120), 120px) 0;}
#cvBox .innerCvBox{ width: min(var(--comp-660), 1280px); margin: 0 auto;}
#cvBox .innerCvBox ul{ display: flex; gap: min(var(--comp-40), 40px);}
#cvBox .innerCvBox ul li{ flex: 1; display: flex; flex-direction: column; padding: min(var(--comp-60), 60px) min(var(--comp-20), 20px);}
#cvBox .innerCvBox ul li:nth-child(1){ background-color: #004282;}
#cvBox .innerCvBox ul li:nth-child(2){ background-color: #0063BE;}
#cvBox .innerCvBox ul li:nth-child(3){ background-color: #1C8BF3;}
#cvBox .innerCvBox ul li .ttl{ font-size: min(var(--comp-42), 30px); line-height: 1.6; margin: 0 auto min(var(--comp-10), 10px); font-family: var(--zen-old); font-weight: 500; width: 100%; color: #fff; text-align: center;}
#cvBox .innerCvBox ul li .text{ font-size: min(var(--comp-24), 16px); line-height: 2.1875; width: 100%; color: #fff; text-align: center; margin-bottom: min(var(--comp-40), 30px);}
#cvBox .innerCvBox ul li .btnType01{ width: min(calc(100% - min(var(--comp-20), 20px) - min(var(--comp-20), 20px)), 280px); box-sizing: border-box; margin: auto auto 0;}
#cvBox .innerCvBox ul li .btnType01 a{ padding: min(var(--comp-30), 10px) min(var(--comp-80), 60px) min(var(--comp-30), 10px) min(var(--comp-40), 30px); background-color: #fff; box-sizing: border-box; width: 100%;}
#cvBox .innerCvBox ul li .btnType01 a .text{ color: var(--navy);}
#cvBox .innerCvBox ul li .btnType01 a .icon::before{ background-color: var(--navy);}
#cvBox .innerCvBox ul li .btnType01 a .icon::after{ border-top: 1px solid var(--navy); border-right: 1px solid var(--navy);}
#fixedCv{ position: fixed; bottom: 0; left: 0; width: 100%; opacity: 0; pointer-events: none; transition: all ease 0.5s; z-index: 999; background-color: rgb(0 33 68 / 0.45);}
#fixedCv.active{ opacity: 1; pointer-events: all;}
#fixedCv .fixedCvList{ display: flex; gap: min(var(--comp-20), 20px); width: clamp(500px, 70vw, 760px); margin: 0 auto; padding: min(var(--comp-40), 20px) 0;}
#fixedCv .fixedCvList li{ flex: 1;}
#fixedCv .fixedCvList li a{ display: block; color: #fff; font-family: var(--zen-old); font-size: min(var(--comp-26), 18px); height: min(var(--comp-90), 60px); display: flex; align-items: center; justify-content: center; flex-direction: column;}
#fixedCv .fixedCvList li a .inner{ width: 100%; display: block; text-align: center;}
#fixedCv .fixedCvList li:nth-child(1) a{ background-color: #004282;}
#fixedCv .fixedCvList li:nth-child(2) a{ background-color: #0063BE;}
#fixedCv .fixedCvList li:nth-child(3) a{ background-color: #1C8BF3;}
#fixedCv .fixedCvList li:nth-child(3) a .nowrap{ text-wrap: nowrap;}
#fixedCv .fixedCvList li .nowrap{ text-wrap: nowrap;}
#fixedCv .move-page-top{ position: absolute; top: 50%; transform: translateY(-50%); right: min(var(--comp-40), 50px);}
#fixedCv .move-page-top button{ color: #fff; display: flex; align-items: center; font-family: var(--zen-old); font-size: min(var(--comp-24), 16px); letter-spacing: 0.1em; gap: min(var(--comp-20), 20px);}
#fixedCv .move-page-top button .wrapIcon{ width: 15px; height: 15px; overflow: hidden;}
#fixedCv .move-page-top button .icon{ display: block; position: relative; width: 100%; height: 100%; transition: all ease 0.6s;}
#fixedCv .move-page-top button .icon::before{ content: ""; display: block; width: 1px; background-color: #fff; height: 100%; position: absolute; top: 0; left: 50%; transform: translateX(-50%); }
#fixedCv .move-page-top button .icon::after{ content: ""; display: block; width: 7px; height: 7px; border-top: 1px solid #fff; border-right: 1px solid #fff; position: absolute; left: 50%; top: 1px; transform: translateX(-50%) rotate(-45deg);}

@media (any-hover: hover) {
#fixedCv .move-page-top button:hover .icon{animation: slideOutIn-tb 0.5s ease forwards; }
}

@media screen and (width <= 1260px){
#cvBox .innerCvBox ul{ flex-wrap: wrap; justify-content: center;}
#cvBox .innerCvBox ul li{ flex: none; width: calc((100% - min(var(--comp-40), 40px) - 1px) / 2); padding-left: 0; padding-right: 0;}
}

@media screen and (width <= 1240px){
#fixedCv .move-page-top button .text{ display: none;}
#fixedCv .move-page-top button .wrapIcon{ width: min(var(--comp-15), 15px); height: min(var(--comp-50), 50px); }
}

@media screen and (width <= 800px){
#cvBox .innerCvBox ul{  flex-wrap: wrap; }
#cvBox .innerCvBox ul li{ width: 100%; flex: none}
#fixedCv{ padding-left: min(var(--comp-40), 20px); display: flex; align-items: center;}
#fixedCv .fixedCvList{ display: flex; gap: 0; width: auto; flex: 1; margin: 0 auto; padding: min(var(--comp-40), 20px) 0;}
#fixedCv .fixedCvList li .nowrap{ width: 100%; display: block;}
#fixedCv .move-page-top{ position: relative; top: auto; transform: translateY(0); right: auto; width: min(var(--comp-100), 100px);}
#fixedCv .move-page-top button{ margin: 0 auto;}
#fixedCv .move-page-top button .text{ display: none;}
#fixedCv .move-page-top button .icon::after{ width: var(--comp-14); height: var(--comp-14); top: 2px; }
}


/*
 FOOTER
--------------------------------*/
footer{ background-color: #002144; padding: min(var(--comp-80), 120px) 0 min(var(--comp-80), 80px); position: relative;}
footer .innerFooter01{ width: min(var(--comp-580), 1280px); margin: 0 auto min(var(--comp-120), 120px); display: flex; gap: min(80px, 80px); align-items: center;}
footer .innerFooter01 h1{ aspect-ratio: 300000 / 76953; width: 300px; background-image: url(../img/common/logo-w.svg); background-repeat: no-repeat; background-position: center center; background-size: contain;}
footer .innerFooter01 .textBox{ width: calc(100% - min(80px, 80px) - 300px - 1px); padding-top: min(var(--comp-15), 15px);}
footer .innerFooter01 .textBox p{ color: #fff; font-family: var(--zen-old); font-size: min(var(--comp-22), 14px); line-height: 2.1428;}
footer .innerFooter02{ width: min(var(--comp-580), 1280px); margin: 0 auto 0; display: flex; justify-content: space-between; margin: 0 auto min(var(--comp-120), 120px);}
footer .mainFooterListBox { display: flex; width: calc(100% - 170px - 1px); gap: min(var(--comp-20), 20px);}
footer .mainFooterListBox > ul{ flex: 1; display: flex; flex-direction: column; font-family: var(--zen-old); gap: min(var(--comp-25), 25px);}
footer .mainFooterListBox > ul:first-child{ flex: 1.2;}
footer .mainFooterListBox > ul > li{ font-size: min(var(--comp-26), 18px); line-height: 1.94;}
footer .mainFooterListBox > ul > li a,
footer .mainFooterListBox > ul > li span{ color: #fff; }
footer .mainFooterListBox > ul > li > a + ul,
footer .mainFooterListBox > ul > li > span + ul{ margin: min(var(--comp-70), 30px) auto 0; display: flex; flex-direction: column; gap: min(var(--comp-25), 25px); box-sizing: border-box; padding-left: min(var(--comp-60), 30px);}
footer .mainFooterListBox > ul > li > a + ul > li,
footer .mainFooterListBox > ul > li > span + ul > li{ font-size: min(var(--comp-24), 16px); line-height: 1.94;}
footer .mainFooterListBox > ul > li > a + ul > li > a + ul,
footer .mainFooterListBox > ul > li > span + ul > li > a + ul{ box-sizing: border-box; padding-left: min(var(--comp-60), 30px); display: flex; flex-direction: column; gap: min(var(--comp-15), 15px); margin-top: min(var(--comp-20), 20px);}
footer .mainFooterListBox > ul > li > a + ul > li > a + ul li,
footer .mainFooterListBox > ul > li > span + ul > li > a + ul li{ font-size: min(var(--comp-22), 14px); line-height: 1.94;}
footer .mainFooterListBox > ul > li > a + ul > li > a + ul li a,
footer .mainFooterListBox > ul > li > span + ul > li > a + ul li a{ color: var(--darkgray);}
footer .innerFooter02 ul.min{ box-sizing: border-box; display: flex; flex-direction: column; gap: min(var(--comp-15), 15px); flex: 170px; font-family: var(--zen-old);}
footer .innerFooter02 ul.min > li{ font-size: min(var(--comp-22), 14px); line-height: 1.94;}
footer .innerFooter02 ul.min > li > a{ color: var(--darkgray);}
footer #copy{ width: min(var(--comp-580), 1280px); margin: 0 auto; color: var(--darkgray); font-family: var(--zen-old); font-size: min(var(--comp-18), 14px);}
footer .move-page-top{ position: absolute; right: min(var(--comp-40), 50px); bottom: min(var(--comp-80), 80px); letter-spacing: 0.1em;}
footer .move-page-top button{ color: #fff; display: flex; align-items: center; font-family: var(--zen-old); font-size: min(var(--comp-24), 16px); letter-spacing: 0.1em; gap: min(var(--comp-20), 20px);}
footer .move-page-top button .wrapIcon{ width: 15px; height: 15px; overflow: hidden;}
footer .move-page-top button .icon{ display: block; position: relative; width: 100%; height: 100%; transition: all ease 0.6s;}
footer .move-page-top button .icon::before{ content: ""; display: block; width: 1px; background-color: #fff; height: 100%; position: absolute; top: 0; left: 50%; transform: translateX(-50%); }
footer .move-page-top button .icon::after{ content: ""; display: block; width: 7px; height: 7px; border-top: 1px solid #fff; border-right: 1px solid #fff; position: absolute; left: 50%; top: 1px; transform: translateX(-50%) rotate(-45deg); font-weight: 500;}

@media (any-hover: hover) {
footer .move-page-top button:hover .icon{animation: slideOutIn-tb 0.5s ease forwards; }
}

@media screen and (width <= 1400px){
footer .innerFooter02{ flex-wrap: wrap;}
footer .mainFooterListBox { width: 100%; margin: 0 auto min(var(--comp-100), 100px);}
footer .innerFooter02 ul.min{ flex: none; width: 100%; flex-direction: row; flex-wrap: wrap; gap: min(var(--comp-25), 25px);}
}

@media screen and (width <= 1130px){
footer .mainFooterListBox { flex-wrap: wrap; row-gap: min(var(--comp-30), 30px); }
footer .mainFooterListBox > ul{ flex: none; width: calc(50% - 1px); }
}

@media screen and (width <= 800px){
footer .innerFooter01{ flex-wrap: wrap; gap: min(var(--comp-70), 70px);}
footer .innerFooter01 h1{ width: var(--comp-360); }
footer .innerFooter01 .textBox{ width: 100%;}
footer .innerFooter01 .textBox p{ line-height: 1.8;}
footer .innerFooter02{ flex-wrap: wrap; margin-bottom: var(--comp-100);}
footer .mainFooterListBox { width: 100%; row-gap: min(var(--comp-20), 20px);}
footer .mainFooterListBox > ul{ width: 100%; }
footer .mainFooterListBox > ul:first-child{ margin-bottom: min(var(--comp-40), 40px);}
footer .innerFooter02 ul.min{ box-sizing: border-box; display: flex; justify-content: space-between;}
footer .innerFooter02 ul.min > li{ width: calc((100% - min(var(--comp-30), 30px) - 1px) / 2);}
footer .move-page-top{ position: relative; right: auto; bottom: auto; width: var(--comp-660); margin: min(var(--comp-80), 80px) auto 0;}
footer .move-page-top button{ margin: 0 0 0 auto;}
footer .move-page-top button .wrapIcon{ width: var(--comp-15); height: var(--comp-15); }
footer .move-page-top button .icon::after{ width: var(--comp-7); height: var(--comp-7); border-top: 1px solid #fff; }
}


/*
 HEADING
--------------------------------*/
/*ttlType01*/
.ttlType01{ max-width: min(var(--comp-580), 1280px); margin: 0 auto min(var(--comp-75), 75px); font-weight: 500; font-family: var(--zen-old);}
.ttlType01 > span{ display: block;}
.ttlType01 .ja{ font-size: min(var(--comp-58), 46px); line-height: 1.46; margin: 0 auto min(var(--comp-20), 10px); color: var(--navy); letter-spacing: 0.05em; font-family: var(--zen-old);}
.ttlType01 .en{ font-size: min(var(--comp-26), 18px); color: var(--darkgray); line-height: 1.46; font-family: var(--zen-old);}
.ttlType01:not(:has( > span)){ font-size: min(var(--comp-58), 46px); line-height: 1.46;}
.ttlType01.center{ text-align: center;}


/*
 BUTTON
--------------------------------*/
/*btnType01*/
.btnType01{ width: min(var(--comp-520), 320px);}
.btnType01 a{ display: block; width: 100%; background-color: var(--navy); color: #fff; font-family: var(--zen-old); font-weight: 500; color: #fff; font-size: min(var(--comp-26), 18px); box-sizing: border-box; padding: min(var(--comp-30), 20px) min(var(--comp-80), 60px) min(var(--comp-30), 20px) min(var(--comp-40), 30px); position: relative; }
.btnType01 a .wrapIcon{ display: block; width: 15px; height: 15px; position: absolute; top: 50%; transform: translateY(-50%); right: min(var(--comp-40), 30px); overflow: hidden;}
.btnType01 a .icon{ display: block; width: 100%; height: 100%; transition: all ease 0.6s;}
.btnType01 a .icon::before{ content: ""; display: block; width: 100%; background-color: #fff; height: 1px; position: absolute; top: 50%; left: 0; transform: translateY(-50%); }
.btnType01 a .icon::after{ content: ""; display: block; width: 7px; height: 7px; border-top: 1px solid #fff; border-right: 1px solid #fff; position: absolute; right: 1px; top: 50%; transform: translateY(-50%) rotate(45deg); font-weight: 500;}

/*btnType02*/
.btnType02 a{ display: flex; gap: min(var(--comp-25), 15px); align-items: center;}
.btnType02 a .text{ font-family: var(--zen-old); font-size: min(var(--comp-26), 18px); color: var(--blue);}
.btnType02 a .wrapIcon{ display: block; width: min(var(--comp-45), 30px); aspect-ratio: 1 / 1 ; background-color: var(--blue); border-radius: 50%; position: relative;}
.btnType02 a .wrapIcon .icon{ width: min(var(--comp-20), 20px); height: min(var(--comp-20), 20px); overflow: hidden; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%);}
.btnType02 a .wrapIcon .icon::after{ content: ""; display: block; aspect-ratio: 1 / 1; width: min(var(--comp-10), 8px); height: min(var(--comp-10), 8px); border-top: 1px solid #fff; border-right: 1px solid #fff; position: absolute; top: 50%; right: min(var(--comp-8), 8px); transform: translateY(-50%) rotate(45deg); }


@media (any-hover: hover) {
.btnType01 a:hover,
#secondContent .smb-btn-box__btn-wrapper a:hover{ opacity: 1;}
.btnType01 a:hover .icon{animation: slideOutIn 0.5s ease forwards; }
.btnType02 a:hover{ opacity: 1;}
.btnType02 a:hover .wrapIcon .icon::after{animation: slideOutIn-Rotate 0.5s ease forwards; }

#secondContent .action-buttons .previousBtn:hover::after,
#secondContent .action-buttons .submitBtn:hover::after,
#secondContent .wp-block-buttons .wp-block-button a:hover::after,
#secondContent .smb-btn-box__btn-wrapper a:hover::after{ animation: slideOutInCF-re 0.5s ease; }
}


@media screen and (width <= 800px){
/*btnType01*/
.btnType01 a .wrapIcon{ display: block; width: var(--comp-22); height: var(--comp-22); }
.btnType01 a .icon::after{ content: ""; display: block; width: var(--comp-8); height: var(--comp-8); }
}



/*--------------------------------------------------------------------------------------------

TOP

--------------------------------------------------------------------------------------------*/
/*
 TOP Main
--------------------------------*/
/*topMainVideo*/
#topMain{ width: 100%; box-sizing: border-box;}
#topMain .wrapTopMain{ width: 100%; position: relative; background-color: rgb(188 220 253 / 1);}
#topMain .wrapTopMain .wrapTopMainVideo{ position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: 1;}
#topMain .wrapTopMain .wrapTopMainVideo .videoBox{ width: 100%; height: 100%;}
#topMain .wrapTopMain .wrapTopMainVideo .videoBox > div{ display: contents;}
#topMain .wrapTopMain .wrapTopMainVideo .videoBox video{ width: 100%; height: 100%; aspect-ratio: 1920 / 1280; object-fit: cover; object-position: center 65%;}
#topMain .wrapTopMain .wrapTopMainText{ min-height: 1000px; position: relative; z-index: 2; display: flex; justify-content: center; flex-direction: column; align-items: center; box-sizing: border-box; padding: min(var(--comp-120), 120px) min(var(--comp-5), 60px) 0; box-sizing: border-box;}
#topMain .wrapTopMain .wrapTopMainText p{ display: block; margin: 0 auto; width: 100%; animation: openingSlideIn 1.5s ease forwards; animation-delay: 1s; transform: translateY(min(var(--comp-20), 20px)); opacity: 0;}
#topMain .wrapTopMain .wrapTopMainText p img{ display: block; margin: 0 auto; width: min(90%, 800px);}

/*topMainBgBox*/
#topMain .topMainBgBox{ position: relative; z-index: 2; background-image: url(../img/top/bg-city-pc.webp); background-repeat: no-repeat; background-position: center bottom; background-size: cover; padding: 0 0 min(var(--comp-400), 540px); background-color: rgb(188 220 253 / 1);}
#topMain .topMainBgBox::before{ content: ""; display: block; width: 100%; height: min(100vh, 250px); background-image: linear-gradient(to bottom, transparent 0%, transparent 5%, rgb(188 220 253 / 1) 25%, rgb(188 220 253 / 1) 75%, transparent 95%, transparent 100%); position: absolute; left: 0; top: calc(min(10vh, 100px) * (-1));}

/*topTickerBox*/
#topMain .topTickerBox{ position: relative; z-index: 2; margin: 0 auto min(var(--comp-140), 100px);}
#topMain .topTickerBox .wrapTopTickerBox{ width: min(var(--comp-660), 1280px); margin: calc(min(var(--comp-80), 80px) * (-1)) auto 0; position: relative;}
#topMain .topTickerBox .wrapTopTickerBox .innerTopTickerBox{ background-color: #fff; box-sizing: border-box; display: flex; align-items: center; padding: min(var(--comp-40), 15px) min(var(--comp-40), 15px) min(var(--comp-40), 15px) 0;} 
#topMain .topTickerBox .wrapTopTickerBox .innerTopTickerBox .ttl{  text-wrap: nowrap; border-right: 1px solid var(--gray); color: var(--blue); font-family: var(--zen-old); font-weight: 500; font-size: min(var(--comp-30), 18px); padding: min(var(--comp-20), 20px) min(var(--comp-30), 30px); line-height: 1; box-sizing: border-box;}
#topMain .topTickerBox .wrapTopTickerBox .innerTopTickerBox .ticker{ overflow: hidden; padding: 0 min(var(--comp-30), 30px); box-sizing: border-box; flex: 1;}
#topMain .topTickerBox .wrapTopTickerBox .innerTopTickerBox .ticker a{ display: flex; position: relative; align-items: center; padding-left: 1px; padding-right: min(var(--comp-50), 50px);}
#topMain .topTickerBox .wrapTopTickerBox .innerTopTickerBox .ticker a .date{ display: inline-block; color: var(--darkgray); font-size: min(var(--comp-24), 16px); margin-right: min(var(--comp-25), 20px); font-family: var(--zen-old); font-weight: 500; text-wrap: nowrap;}
#topMain .topTickerBox .wrapTopTickerBox .innerTopTickerBox .ticker a .cate{ display: inline-block; font-size: min(var(--comp-24), 16px); font-family: var(--zen-old);color: #fff; width: auto; min-width: 6em; background-color: var(--blue); text-align: center; text-wrap: nowrap; padding: min(var(--comp-5), 5px) min(var(--comp-10), 10px); margin-right: min(var(--comp-30), 30px);}
#topMain .topTickerBox .wrapTopTickerBox .innerTopTickerBox .ticker a .text{ display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 1; line-height: 1.8; color: var(--navy); font-size: min(var(--comp-24), 16px); font-family: var(--base-font);}
#topMain .topTickerBox .wrapTopTickerBox .innerTopTickerBox .ticker a .wrapIcon{ width: 15px; aspect-ratio: 1 / 1; position: absolute; right: 1px; top: 50%; transform: translateY(-50%); overflow: hidden; }
#topMain .topTickerBox .wrapTopTickerBox .innerTopTickerBox .ticker a .wrapIcon .icon{ display: block; width: 100%; height: 100%; transition: all ease 0.6s;}
#topMain .topTickerBox .wrapTopTickerBox .innerTopTickerBox .ticker a .wrapIcon .icon::before{ content: ""; display: block; width: 100%; background-color: var(--navy); height: 1px; position: absolute; top: 50%; left: 0; transform: translateY(-50%); }
#topMain .topTickerBox .wrapTopTickerBox .innerTopTickerBox .ticker a .wrapIcon .icon::after{ content: ""; display: block; width: 7px; height: 7px; border-top: 1px solid var(--navy); border-right: 1px solid var(--navy); position: absolute; right: 2px; top: 50%; transform: translateY(-50%) rotate(45deg); }
#topMain .topTickerBox .wrapTopTickerBox .btnType02{ margin: min(var(--comp-25), 20px) auto 0; box-sizing: border-box; padding: 0 min(var(--comp-30), 20px); box-sizing: border-box; display: flex; justify-content: flex-end;}

/*topMainCatchBox*/
#topMain .topMainCatchBox{ position: relative; z-index: 3; display: flex; align-items: flex-start; gap: min(var(--comp-60), 60px); justify-content: space-between;}
#topMain .topMainCatchBox > .textBox{ padding: min(var(--comp-75), 75px) 0 0 min(var(--comp-80), 80px); box-sizing: border-box; width: calc(50% + 180px); animation: none; opacity: 1;}
#topMain .topMainCatchBox > .textBox .innerTextBox{ width: min(100%, 820px); margin: 0 0 0 auto;}
#topMain .topMainCatchBox > .textBox .innerTextBox .catch{ font-family: var(--zen-old); color: #fff; font-weight: 900; font-size: min(var(--comp-44), 34px); line-height: 1.63; margin: 0 auto min(var(--comp-100), 70px); opacity: 0;}
#topMain .topMainCatchBox > .textBox .innerTextBox .lead{ font-family: var(--zen-old); color: #fff; font-weight: 500; font-size: min(var(--comp-28), 20px); line-height: 2.27; margin: 0 auto; font-feature-settings: "palt"; letter-spacing: 0.04em; opacity: 0;}
#topMain .topMainCatchBox > .textBox.scrollin .innerTextBox .catch{ animation: openingSlideIn 1.5s ease forwards; animation-delay: 0.2s;}
#topMain .topMainCatchBox > .textBox.scrollin .innerTextBox .lead{ animation: openingSlideIn 1.5s ease forwards; animation-delay: 1s;}
#topMain .topMainCatchBox > .textBox .innerTextBox .lead sub{ display: inline-block; transform: translateY(-0.2em);}
#topMain .topMainCatchBox > .textBox .innerTextBox .lead sub a{ text-decoration: underline;}
#topMain .topMainCatchBox > .textBox .innerTextBox .caution{ color: #fff; font-size: min(var(--comp-22), 14px); line-height: 1.8; }
#topMain .topMainCatchBox .linkList{ width: calc(50% - 180px - min(var(--comp-60), 60px)); display: flex; flex-wrap: wrap; gap: min(var(--comp-80), 80px);}
#topMain .topMainCatchBox .linkList li{ width: 100%; padding-right: min(var(--comp-80), 80px); box-sizing: border-box; position: relative;}
#topMain .topMainCatchBox .linkList li::before{ content: ""; display: block; width: 100%; height: calc(100% - min(var(--comp-60), 60px)); position: absolute; bottom: 0; left: 0; background-color: rgb(0 66 130 / 0.75);}
#topMain .topMainCatchBox .linkList li .imgBox{ width: min(100%, 600px); margin: 0 auto 0 0; position: relative;}
#topMain .topMainCatchBox .linkList li .imgBox a{ display: block; position: relative;}
#topMain .topMainCatchBox .linkList li .imgBox a figure{ display: block; }
#topMain .topMainCatchBox .linkList li .imgBox a figure img{ display: block; }
#topMain .topMainCatchBox .linkList li .imgBox a .arrow{ position: absolute; top: 50%; right: calc(min(var(--comp-30), 30px) * (-1)); transform: translateY(-50%); aspect-ratio: 1 / 1; width: min(var(--comp-60), 45px); background-color: #fff; border-radius: 50%; }
#topMain .topMainCatchBox .linkList li .imgBox a .arrow .wrapIcon{ display: block; width: 15px; height: 15px; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); overflow: hidden;}
#topMain .topMainCatchBox .linkList li .imgBox a .arrow .icon{ display: block; width: 100%; height: 100%; transition: all ease 0.6s;}
#topMain .topMainCatchBox .linkList li .imgBox a .arrow .icon::before{ content: ""; display: block; width: 100%; background-color: var(--navy); height: 1px; position: absolute; top: 50%; left: 0; transform: translateY(-50%); }
#topMain .topMainCatchBox .linkList li .imgBox a .arrow .icon::after{ content: ""; display: block; width: 7px; height: 7px; border-top: 1px solid var(--navy); border-right: 1px solid var(--navy); position: absolute; right: 1px; top: 50%; transform: translateY(-50%) rotate(45deg); }
#topMain .topMainCatchBox .linkList li .textBox{ padding: min(var(--comp-30), 25px) 0 min(var(--comp-30), 25px) min(var(--comp-40), 30px); position: relative;}
#topMain .topMainCatchBox .linkList li .textBox p{ color: #fff; font-family: var(--zen-old); }
#topMain .topMainCatchBox .linkList li .textBox .ttl{ font-size: min(var(--comp-38), 26px); line-height: 1.6; margin-bottom: min(var(--comp-10), 10px);}
#topMain .topMainCatchBox .linkList li .textBox .text{ font-size: min(var(--comp-24), 16px); line-height: 1.8;}

@media (any-hover: hover) {
#topMain .topTickerBox .wrapTopTickerBox .innerTopTickerBox .ticker a:hover{ opacity: 1;}
#topMain .topTickerBox .wrapTopTickerBox .innerTopTickerBox .ticker a:hover .wrapIcon .icon{animation: slideOutIn 0.5s ease forwards; }
#topMain .topMainCatchBox .linkList li .imgBox a:hover{ opacity: 1;}
#topMain .topMainCatchBox .linkList li .imgBox a:hover .arrow .icon{animation: slideOutIn 0.5s ease forwards; }
}

@media screen and (1280px < width <= 1440px){
#topMain .topMainCatchBox > .textBox .innerTextBox .catch{ font-size: min(var(--comp-35), 28px); }
#topMain .topMainCatchBox > .textBox .innerTextBox .lead{ font-size: min(var(--comp-26), 18px); }
}

@media screen and (width <= 1280px){
/*topMainCatchBox*/
#topMain .topMainCatchBox{ flex-wrap: wrap; width: 100%; gap: min(var(--comp-160), 160px);}
#topMain .topMainCatchBox > .textBox{ width: 100%; padding-right: min(var(--comp-80), 80px);}
#topMain .topMainCatchBox > .textBox .innerTextBox{ width: 100%;}
#topMain .topMainCatchBox .linkList{ width: min(calc(100% - min(var(--comp-80), 80px)), 650px); display: flex; flex-wrap: wrap; gap: min(var(--comp-80), 80px); box-sizing: border-box; margin: 0 0 0 auto; }
}

@media screen and (width <= 800px){
/*topMainVideo*/ 
#topMain .wrapTopMain{ width: 100%; position: relative;}
#topMain .wrapTopMain .wrapTopMainVideo .videoBox video{ aspect-ratio: 740 / 1300;}
#topMain .wrapTopMain .wrapTopMainText{ min-height: 185vw; position: relative; z-index: 2; display: flex; justify-content: center; flex-direction: column; align-items: center; box-sizing: border-box; padding: 0 min(var(--comp-5), 60px);}

/*topMainBgBox*/
#topMain .topMainBgBox{ background-image: url(../img/top/bg-city-sp.webp); background-repeat: no-repeat; background-position: center bottom; background-size: cover; padding: 0 0 min(var(--comp-400), 240px);}
#topMain .topMainBgBox::before{ height: min(100vh, 400px); left: 0; top: calc(min(15vh, 150px) * (-1));}

/*topTickerBox*/
#topMain .topTickerBox .wrapTopTickerBox{ margin: calc(min(var(--comp-140), 140px) * (-1)) auto 0; }
#topMain .topTickerBox .wrapTopTickerBox .innerTopTickerBox{ flex-wrap: wrap; padding: min(var(--comp-40), 40px);} 
#topMain .topTickerBox .wrapTopTickerBox .innerTopTickerBox .ttl{ width: 100%; border-right: none; color: var(--blue); border-bottom: 1px solid var(--gray); padding: 0 0 min(var(--comp-20), 20px); margin-bottom: min(var(--comp-40), 40px);}
#topMain .topTickerBox .wrapTopTickerBox .innerTopTickerBox .ticker{ padding: 0 1px; width: 100%;}
#topMain .topTickerBox .wrapTopTickerBox .innerTopTickerBox .ticker a{ display: flex; flex-wrap: wrap; position: relative; align-items: center; padding-left: 1px; padding-right: min(var(--comp-50), 50px);}
#topMain .topTickerBox .wrapTopTickerBox .innerTopTickerBox .ticker a .date{ display: inline-block; color: var(--darkgray); font-size: min(var(--comp-24), 16px); margin-right: min(var(--comp-25), 20px); font-family: var(--zen-old); font-weight: 500; text-wrap: nowrap;}
#topMain .topTickerBox .wrapTopTickerBox .innerTopTickerBox .ticker a .cate{ display: inline-block; font-size: min(var(--comp-24), 16px); font-family: var(--zen-old);color: #fff; width: auto; min-width: 6em; background-color: var(--blue); text-align: center; text-wrap: nowrap; padding: min(var(--comp-5), 5px) min(var(--comp-10), 10px); margin-right: min(var(--comp-30), 30px);}
#topMain .topTickerBox .wrapTopTickerBox .innerTopTickerBox .ticker a .text{ margin: min(var(--comp-25), 25px) 0 0;}
#topMain .topTickerBox .wrapTopTickerBox .innerTopTickerBox .ticker a .wrapIcon{ width: min(var(--comp-22), 22px); top: auto; bottom: min(var(--comp-20), 12px); transform: translateY(50%); }
#topMain .topTickerBox .wrapTopTickerBox .innerTopTickerBox .ticker a .wrapIcon .icon::after{ width: var(--comp-10); height: var(--comp-10); }

/*topMainCatchBox*/
#topMain .topMainCatchBox > .textBox{ padding: 0; width: 100%;}
#topMain .topMainCatchBox > .textBox .innerTextBox{ width: min(var(--comp-580), 820px); margin: 0 auto;}
#topMain .topMainCatchBox .linkList{ width: var(--comp-660); }
#topMain .topMainCatchBox .linkList li{ width: 100%; padding-right: min(var(--comp-80), 80px); box-sizing: border-box; position: relative;}
#topMain .topMainCatchBox .linkList li .imgBox{ width: min(100%, 560px); margin: 0 auto 0 0; position: relative;}
#topMain .topMainCatchBox .linkList li .imgBox a .arrow .wrapIcon{ width: var(--comp-15); height: var(--comp-15); }
#topMain .topMainCatchBox .linkList li .imgBox a .arrow .icon::after{ width: var(--comp-7); height: var(--comp-7); }
}

/*
 TOP PICK UP
--------------------------------*/
#topPickUp{ overflow-x: hidden; box-sizing: border-box; padding: min(var(--comp-100), 100px) 0 min(var(--comp-160), 160px); background-image: url(../img/common/bg-texture-01.jpg); background-repeat: repeat; background-position: center top; }
#topPickUp .ttlType01{ margin: 0 auto min(var(--comp-50), 50px); color: var(--navy);}

/*pickupSlide*/
#pickupSlide{ width: min(var(--comp-540), 440px); margin: 0 auto 0; position: relative;} 
#pickupSlide .topPickUpSlider{ z-index: 2;}
#pickupSlide .topPickUpSlider .slick-list{ overflow: visible;}
#pickupSlide .topPickUpSlider .slick-slide{ padding: 0 min(var(--comp-20), 20px);}
#pickupSlide .slick-arrow{ aspect-ratio: 1 / 1 ; width: min(var(--comp-60), 60px); position: absolute; background-color: var(--navy); border-radius: 50%; transition: background-color ease 0.5s;}
#pickupSlide .slick-arrow::before,
#pickupSlide .slick-arrow::after{ content: none;}
#pickupSlide .pickupPrev{ top: 50%; z-index: 3; transform: translateY(-50%); right: min(calc(50% + var(--comp-300)), 50% + 610px); left: auto;}
#pickupSlide .pickupNext{ top: 50%; z-index: 3; transform: translateY(-50%); left: min(calc(50% + var(--comp-300)), 50% + 610px); right: auto;}
#pickupSlide .pickupPrev .wrapIcon{ display: block; width: 15px; height: 15px; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); overflow: hidden;}
#pickupSlide .pickupPrev .icon{ display: block; width: 100%; height: 100%; transition: all ease 0.6s;}
#pickupSlide .pickupPrev .icon::before{ content: ""; display: block; width: 100%; background-color: #fff; height: 1px; position: absolute; top: 50%; left: 0; transform: translateY(-50%); }
#pickupSlide .pickupPrev .icon::after{ content: ""; display: block; width: 7px; height: 7px; border-top: 1px solid #fff; border-left: 1px solid #fff; position: absolute; left: 1px; top: 50%; transform: translateY(-50%) rotate(-45deg); }
#pickupSlide .pickupNext .wrapIcon{ display: block; width: 15px; height: 15px; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); overflow: hidden;}
#pickupSlide .pickupNext .icon{ display: block; width: 100%; height: 100%; transition: all ease 0.6s;}
#pickupSlide .pickupNext .icon::before{ content: ""; display: block; width: 100%; background-color: #fff; height: 1px; position: absolute; top: 50%; left: 0; transform: translateY(-50%); }
#pickupSlide .pickupNext .icon::after{ content: ""; display: block; width: 7px; height: 7px; border-top: 1px solid #fff; border-right: 1px solid #fff; position: absolute; right: 1px; top: 50%; transform: translateY(-50%) rotate(45deg); }

@media (any-hover: hover) {
#pickupSlide .slick-arrow:hover{ background-color: #fff;}
#pickupSlide .pickupPrev:hover .icon{animation: slideOutIn-re 0.5s ease forwards; }
#pickupSlide .pickupPrev:hover .icon::before{ background-color: var(--navy);}
#pickupSlide .pickupPrev:hover .icon::after{ border-top: 1px solid var(--navy); border-left: 1px solid var(--navy);}
#pickupSlide .pickupNext:hover .icon{animation: slideOutIn 0.5s ease forwards; }
#pickupSlide .pickupNext:hover .icon::before{ background-color: var(--navy);}
#pickupSlide .pickupNext:hover .icon::after{ border-top: 1px solid var(--navy); border-right: 1px solid var(--navy);}
}

@media screen and (width <= 800px){
#pickupSlide .pickupPrev{ top: 50%; z-index: 3; transform: translateY(-50%); right: calc(50% + var(--comp-260)); left: auto;}
#pickupSlide .pickupNext{ top: 50%; z-index: 3; transform: translateY(-50%); left: calc(50% + var(--comp-260)); right: auto;}
#pickupSlide .pickupPrev .wrapIcon{ width: var(--comp-15); height: var(--comp-15); }
#pickupSlide .pickupPrev .icon::after{ width: var(--comp-7); height: var(--comp-7); }
#pickupSlide .pickupNext .wrapIcon{ width: var(--comp-15); height: var(--comp-15); }
#pickupSlide .pickupNext .icon::after{ width: var(--comp-7); height: var(--comp-7); }
}


/*
 TOP ROUDOUOUEN KONSARU
--------------------------------*/
#topRoumuouenKonsaru{ overflow-x: hidden; box-sizing: border-box; padding: min(var(--comp-160), 160px) 0; background-image: url(../img/common/bg-texture-02.jpg); background-repeat: repeat; background-position: center top;  }
#topRoumuouenKonsaru .ttlType01 .ja{ color: #fff; }
#topRoumuouenKonsaru .innerTopRoumuouenKonsaru{ width: min(var(--comp-580), 1280px); margin: 0 auto min(var(--comp-160), 80px);}
#topRoumuouenKonsaru .innerTopRoumuouenKonsaru > .text{ font-size: min(var(--comp-24), 16px); color: #fff; width: min(95%, 1160px); margin: 0 0 0 auto;}
#roumuouenKonsaruBtnBox{ width: 100%; display: flex; flex-direction: row-reverse; align-items: center; margin: 0 auto min(var(--comp-80), 60px);}
#topRoumuouenKonsaru .btnType01{ width: min(var(--comp-520), 400px); margin: 0 auto;}

/*btnList*/
#roumuouenKonsaruBtnBox .wrapBtnList{ width: 37.5%; padding-right: min(var(--comp-80), 80px);}
#roumuouenKonsaruBtnBox .wrapBtnList .btnList{ width: 100%; max-width: 440px; margin: 0 auto 0 0; padding-left: min(var(--comp-80), 80px);}
#roumuouenKonsaruBtnBox .wrapBtnList .btnList li{ position: relative;}
#roumuouenKonsaruBtnBox .wrapBtnList .btnList li a{ box-sizing: border-box; padding: min(var(--comp-44), 45px) min(var(--comp-60), 60px) min(var(--comp-45), 45px) 0; font-family: var(--zen-old); color: #fff; font-size: min(var(--comp-38), 30px); display: block; width: 100%;}
#roumuouenKonsaruBtnBox .wrapBtnList .btnList li a::before{ content: ""; display: block; position: absolute; bottom: 0; right: 0; height: 1px; width: 100%; background-color: var(--darkgray); transition: width ease 0.6s, background-color ease 0.7s;}
#roumuouenKonsaruBtnBox .wrapBtnList .btnList li a .wrapIcon2{ display: block; width: 15px; height: 15px; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%) rotate(180deg); overflow: hidden;}
#roumuouenKonsaruBtnBox .wrapBtnList .btnList li a .wrapIcon2 .icon{ display: block; width: 100%; height: 100%; transition: all ease 0.6s;}
#roumuouenKonsaruBtnBox .wrapBtnList .btnList li a .wrapIcon2 .icon::before{ content: ""; display: block; width: 100%; background-color: #fff; height: 1px; position: absolute; top: 50%; left: 0; transform: translateY(-50%); }
#roumuouenKonsaruBtnBox .wrapBtnList .btnList li a .wrapIcon2 .icon::after{ content: ""; display: block; width: 7px; height: 7px; border-top: 1px solid #fff; border-left: 1px solid #fff; position: absolute; left: 1px; top: 50%; transform: translateY(-50%) rotate(-45deg); }
#roumuouenKonsaruBtnBox .wrapBtnList .btnList li.active a::before{ width: calc(100% + min(var(--comp-80), 80px)); background-color: #fff; }

/*roudououenKonsaruSortBox*/
#roumuouenKonsaruBtnBox .roudououenKonsaruSortBox{ width: calc(100% - 37.5%);}
#roumuouenKonsaruBtnBox .roudououenKonsaruSortBox > div{ position: relative; display: none; transform: translateX(-5%);}
#roumuouenKonsaruBtnBox .roudououenKonsaruSortBox > div .img{ width: 100%; aspect-ratio: 1920 / 1152; min-height: 650px; overflow: hidden; display: block;}
#roumuouenKonsaruBtnBox .roudououenKonsaruSortBox > div .img img{ display: block; width: 100%; height: 100%; object-fit: cover}
#roumuouenKonsaruBtnBox .roudououenKonsaruSortBox > div.active{ display: block; transform: translateX(0); transition: transform ease 0.8s;}
#roumuouenKonsaruBtnBox .roudououenKonsaruSortBox > div .listBox{ background-color: rgb(0 33 68 / 0.6); position: absolute; bottom: 0; width: 100%; padding: min(var(--comp-40), 40px) 0 min(var(--comp-40), 40px) min(var(--comp-40), 40px); box-sizing: border-box;}

/*listBox*/
#roumuouenKonsaruBtnBox .roudououenKonsaruSortBox > div .listBox > ul{ font-size: min(var(--comp-30), 22px); line-height: 1em; display: flex; flex-wrap: wrap; row-gap: 1.5em; background-image: linear-gradient(to bottom, transparent 0%, transparent calc(100% - 1px), var(--darkgray) calc(100% - 1px), var(--darkgray) 100%); background-size: 4em 4em; background-repeat: repeat; background-position: center top -1.5em; width: min(100%, 840px); margin: 0 0 0 auto;}
#roumuouenKonsaruBtnBox .roudououenKonsaruSortBox > div .listBox > ul li{ min-width: calc(100% / 3); padding-right: min(var(--comp-20), 20px); color: #fff; font-family: var(--zen-old); font-weight: 500; padding-bottom: 1.5em; box-sizing: border-box;}
#roumuouenKonsaruBtnBox .roudououenKonsaruSortBox > div .listBox > ul li::before{ content: "■"; color: var(--blue); margin-right: min(var(--comp-15), 10px);}

@media screen and (width > 1080px) and (any-hover: hover) {
#roumuouenKonsaruBtnBox .wrapBtnList .btnList li a:hover{ opacity: 1;}
#roumuouenKonsaruBtnBox .wrapBtnList .btnList li a:hover .wrapIcon1{ background-color: #fff;}
#roumuouenKonsaruBtnBox .wrapBtnList .btnList li a:hover .icon{animation: slideOutIn-re 0.6s ease forwards; }
#roumuouenKonsaruBtnBox .wrapBtnList .btnList li a:hover .icon::before{ background-color: var(--navy);}
#roumuouenKonsaruBtnBox .wrapBtnList .btnList li a:hover .icon::after{ border-top: 1px solid var(--navy); border-left: 1px solid var(--navy);}
}

@media screen and (width <= 1080px) and (any-hover: hover) {
#roumuouenKonsaruBtnBox .wrapBtnList .btnList li a:hover{ opacity: 1;}
#roumuouenKonsaruBtnBox .wrapBtnList .btnList li a:hover .wrapIcon1{ background-color: #fff;}
#roumuouenKonsaruBtnBox .wrapBtnList .btnList li a:hover .icon{animation: slideOutIn-re 0.6s ease forwards; }
#roumuouenKonsaruBtnBox .wrapBtnList .btnList li a:hover .icon::before{ background-color: var(--navy);}
#roumuouenKonsaruBtnBox .wrapBtnList .btnList li a:hover .icon::after{ border-top: 1px solid var(--navy); border-left: 1px solid var(--navy);}
}

@media screen and (width > 1080px){
#roumuouenKonsaruBtnBox .wrapBtnList .btnList li a .wrapIcon1{ width: 45px; aspect-ratio: 1 / 1; background-color: var(--navy); display: block; position: absolute; top: 50%; right: 0; transform: translateY(-50%); border-radius: 50%; transition: background-color ease 0.5s;}
#roumuouenKonsaruBtnBox .roudououenKonsaruSortBox > div .listBox > .btnType01{ display: none;}
}

@media screen and (width <= 1080px){
#roumuouenKonsaruBtnBox{ flex-wrap: wrap;}
#topRoumuouenKonsaru .innerTopRoumuouenKonsaru > .text{ width: 100%; margin: 0 auto;}

/*btnList*/
#roumuouenKonsaruBtnBox .wrapBtnList{ width: 100%; padding: 0;}
#roumuouenKonsaruBtnBox .wrapBtnList .btnList{ width: 78.3783783783783%; max-width: 78.3783783783783%; margin: 0 auto 0; padding-left: 0; padding-bottom: min(var(--comp-80), 80px); display: flex; justify-content: center;}
#roumuouenKonsaruBtnBox .wrapBtnList .btnList li{ width: calc((100% - 1px) / 5); flex: none}
#roumuouenKonsaruBtnBox .wrapBtnList .btnList li:first-child{ border-left: 1px solid var(--darkgray);}
#roumuouenKonsaruBtnBox .wrapBtnList .btnList li a{ box-sizing: border-box; padding: 0 0 min(var(--comp-90), 90px); display: flex; flex-wrap: wrap; flex-direction: column; align-items: center; width: 100%; writing-mode: vertical-rl; transform: rotate(0deg);}
#roumuouenKonsaruBtnBox .wrapBtnList .btnList li a::before{ content: ""; display: block; bottom: auto; top: 0; right: 0; height: 100%; width: 1px; background-color: var(--darkgray); transition: height ease 0.6s, background-color ease 0.7s;}
#roumuouenKonsaruBtnBox .wrapBtnList .btnList li a .text{ display: block; margin: 0 auto; height: 4.5em;}
#roumuouenKonsaruBtnBox .wrapBtnList .btnList li a .wrapIcon1{ width: var(--comp-45); aspect-ratio: 1 / 1; background-color: var(--navy); display: block; position: absolute; bottom: 0; left: calc(50% - (var(--comp-45) / 2)); writing-mode: initial; backface-visibility: hidden; transform: rotate(90deg); border-radius: 50%; transition: background-color ease 0.5s; writing-mode: initial;}
#roumuouenKonsaruBtnBox .wrapBtnList .btnList li a .wrapIcon2{ width: var(--comp-15); height: var(--comp-15); }
#roumuouenKonsaruBtnBox .wrapBtnList .btnList li a .wrapIcon2 .icon::after{ width: var(--comp-7); height: var(--comp-7); }
#roumuouenKonsaruBtnBox .wrapBtnList .btnList li.active a::before{ width: 1px; height: calc(100% + min(var(--comp-80), 80px)); }

/*roudououenKonsaruSortBox*/
#roumuouenKonsaruBtnBox .roudououenKonsaruSortBox{ width: 100%;}
#roumuouenKonsaruBtnBox .roudououenKonsaruSortBox > div .listBox{ padding-left: 0;}
#roumuouenKonsaruBtnBox .roudououenKonsaruSortBox > div .listBox > .btnType01{ width: min(var(--comp-340), 340px); margin: min(var(--comp-40), 40px) auto 0;}
#roumuouenKonsaruBtnBox .roudououenKonsaruSortBox > div .listBox > .btnType01 a{ background-color: var(--blue); font-size: min(var(--comp-24), 16px); padding: min(var(--comp-20), 10px) min(var(--comp-80), 60px) min(var(--comp-20), 10px) min(var(--comp-40), 30px); }

/*listBox*/
#roumuouenKonsaruBtnBox .roudououenKonsaruSortBox > div .listBox > ul{ width: var(--comp-580); margin: 0 auto;}
}

@media screen and (width <= 800px){
#topRoumuouenKonsaru .innerTopRoumuouenKonsaru{ width: min(var(--comp-580), 1280px); margin: 0 auto min(var(--comp-160), 80px);}

/*roudououenKonsaruSortBox*/
#roumuouenKonsaruBtnBox .roudououenKonsaruSortBox{ width: 100%;}
#roumuouenKonsaruBtnBox .roudououenKonsaruSortBox > div{ position: relative; transform: translateY(5%);}
#roumuouenKonsaruBtnBox .roudououenKonsaruSortBox > div .img{ width: 100%; aspect-ratio: 1920 / 1152; min-height: 0; }
#roumuouenKonsaruBtnBox .roudououenKonsaruSortBox > div.active{ transform: translateY(0); transition: transform ease 0.8s;}
#roumuouenKonsaruBtnBox .roudououenKonsaruSortBox > div .listBox{ position: relative; bottom: auto; margin: calc(min(var(--comp-160), 160px) * (-1)) auto 0; width: var(--comp-580); padding: min(var(--comp-40), 40px); box-sizing: content-box;}

/*listBox*/
#roumuouenKonsaruBtnBox .roudououenKonsaruSortBox > div .listBox > ul{ line-height: 1em; row-gap: 1em; background-image: none; width: min(100%, 840px); margin: 0 auto;}
#roumuouenKonsaruBtnBox .roudououenKonsaruSortBox > div .listBox > ul li{ min-width: 100%; padding-right: 0; padding-bottom: 1em; border-bottom: 1px solid var(--darkgray); line-height: 1.6em; text-indent: calc((1em + min(var(--comp-15), 10px)) * (-1)); padding-left: calc(1em + min(var(--comp-15), 10px));}
}



/*
 TOP PROBLEM
--------------------------------*/
#topProblem{ padding: min(var(--comp-160), 160px) 0; background-image: url(../img/top/bg-problem-pc.webp), url(../img/common/bg-texture-03.jpg); background-repeat: no-repeat, repeat; background-position: center top; background-size: max(100%, 1920px) auto, auto;}
#topProblem .innerTopProblem{ width: min(var(--comp-580), 1280px); margin: 0 auto;}
#topProblem .ttlType01 .ja{ color: #fff; }
#topProblem .btnType01{ margin: 0 auto;}
#topProblem .topProblemIconList{ display: flex; flex-wrap: wrap; gap: min(var(--comp-20), 40px); margin: 0 auto min(var(--comp-85), 60px); max-width: 1040px;}
#topProblem .topProblemIconList li{ width: calc((100% - min(var(--comp-20), 40px) - min(var(--comp-20), 40px)) / 3);  }
#topProblem .topProblemIconList li a{ display: block; border: 1px solid var(--gray); background-color: rgb(0 33 68 / 0.45); height: 100%; box-sizing: border-box; padding: min(var(--comp-40), 25px) min(var(--comp-10), 10px);}
#topProblem .topProblemIconList li figure{ width: min(var(--comp-90), 60px); aspect-ratio: 1 / 1; display: block; margin: 0 auto min(var(--comp-40), 30px);}
#topProblem .topProblemIconList li .text{ font-family: var(--zen-old); color: #fff; font-size: min(var(--comp-26), 18px); padding: 0 min(var(--comp-10), 20px); text-align: center;  line-height: 1.7;}

@media screen and (width <= 1200px){
#topProblem .topProblemIconList li{ width: calc((100% - min(var(--comp-20), 40px)) / 2); }
#topProblem .topProblemIconList li a{ padding: min(var(--comp-40), 30px) min(var(--comp-10), 10px);}
}

@media screen and (width <= 800px){
#topProblem{ padding: min(var(--comp-160), 160px) 0; background-image: url(../img/top/bg-problem-sp.webp), url(../img/common/bg-texture-03.jpg); background-repeat: no-repeat, repeat; background-position: center top; background-size: 100% auto, auto;}
#topProblem .innerTopProblem{ width: var(--comp-660); margin: 0 auto;}
#topProblem .topProblemIconList li .text{ padding: 0; font-feature-settings: "palt"; letter-spacing: 0.01em;}
}


/*
 TOP KOMON VOICE & TOP SEMINAR
--------------------------------*/
#topKomonVoice{ padding: min(var(--comp-160), 160px) 0 min(var(--comp-130), 130px); background-image: url(../img/common/bg-texture-01.jpg); background-repeat: repeat; background-position: center top;  overflow: hidden;}
#topSeminar{ padding: min(var(--comp-160), 160px) 0 min(var(--comp-130), 130px); background-image: url(../img/top/bg-seminar-pc.webp); background-repeat: no-repeat; background-position: center top; background-size: cover; overflow: hidden;}
#topSeminar .ttlType01 .ja{ color: #fff; }
#topKomonVoice .innerTopKomonVoice,
#topSeminar .innerTopSeminar{ display: flex; align-items: flex-start; justify-content: space-between; gap: min(var(--comp-40), 80px); width: 100%; flex-wrap: wrap;}
#topKomonVoice .innerTopKomonVoice .textBox,
#topSeminar .innerTopSeminar .textBox{ width: max( calc(50% - 240px - min(var(--comp-40), 80px)), calc(320px + min(var(--comp-80), 80px))); padding-left: min(var(--comp-80), 80px); box-sizing: border-box;}
#topKomonVoice .innerTopKomonVoice .textBox .innerTextBox,
#topSeminar .innerTopSeminar .textBox .innerTextBox{ width: min(100%, 320px); margin: 0 0 0 auto;}

/*Slider*/
#topKomonVoice .wrapTopVoiceSlide,
#topSeminar .wrapTopSeminarSlide{ width: calc(100% - max( calc(50% - 240px - min(var(--comp-40), 80px)), calc(320px + min(var(--comp-80), 80px))) - 1px - min(var(--comp-40), 80px)); overflow: hidden;}
#topVoiceSlide.swiper,
#topSeminarSlide.swiper{ margin: 0; overflow: visible; width: 100%; box-sizing: border-box;}
#topVoiceSlide.swiper .swiper-container,
#topSeminarSlide.swiper .swiper-container{ width: 25vw;}
#topVoiceSlide.swiper .swiper-container:has( + .pager:not([style*="display: display"])),
#topSeminarSlide.swiper .swiper-container:has( + .pager:not([style*="display: display"])){ margin-bottom: min(var(--comp-30), 30px);}
#topVoiceSlide .swiper-slide,
#topSeminarSlide .swiper-slide{ width: 100% !important; height: 100%; padding: 0 min(var(--comp-40), 40px) 0 0;}
#topVoiceSlide,
#topSeminarSlide{ width: 100%; margin: 0 auto; position: relative; } 
#topVoiceSlide figure,
#topSeminarSlide figure{ width: 100%; margin-bottom: min(var(--comp-15), 15px); position: relative;}
#topVoiceSlide figure img,
#topSeminarSlide figure img{ display: block; object-fit: cover; width: 100%; height: 100%; background-color: var(--fontgray); transition: all 1s ease;}
#topVoiceSlide .cate{ padding-bottom: min(var(--comp-15), 15px); margin: 0 auto min(var(--comp-15), 15px); color: var(--navy); font-size: min(var(--comp-24), 16px); font-family: var(--zen-old); line-height: 1.6; border-bottom: 1px solid var(--gray); font-weight: 500;}
#topSeminarSlide .date{ padding-bottom: min(var(--comp-15), 15px); margin: 0 auto min(var(--comp-15), 15px); color: #fff; font-size: min(var(--comp-24), 16px); font-family: var(--zen-old); line-height: 1.6; border-bottom: 1px solid var(--gray); font-weight: 500;}
#topSeminarSlide .date .nowrap{ display: inline-block;}
#topSeminarSlide .date .nowrap:not(:last-child){ margin-right: 0.5em; }
#topVoiceSlide .ttl,
#topSeminarSlide .ttl{ margin: 0 auto; font-size: min(var(--comp-30), 22px); font-family: var(--zen-old); line-height: 1.8; font-weight: 500;}
#topVoiceSlide .ttl{ color: var(--navy);}
#topSeminarSlide .ttl{ color: #fff; }
#topVoiceSlide .pager,
#topSeminarSlide .pager{ position: relative; width: min(calc(100% - min(var(--comp-80), 80px)), 880px); margin: min(var(--comp-50), 50px) auto 0 0; display: flex; gap: min(var(--comp-40), 40px); align-items: center;}
#topVoiceSlide .pager .arrow,
#topSeminarSlide .pager .arrow{ order: 2; position: relative; display: flex; justify-content: space-between; gap: min(var(--comp-20), 20px); width: calc(min(var(--comp-60), 60px) * 2 + min(var(--comp-20), 20px)); height: min(var(--comp-60), 60px);}
#topVoiceSlide .pager .arrow button,
#topSeminarSlide .pager .arrow button{ display: block; aspect-ratio: 1 / 1 ; width: min(var(--comp-60), 60px); height: min(var(--comp-60), 60px); background-color: var(--navy); border-radius: 50%; transition: background-color ease 0.5s; position: relative; top: auto; left: auto; bottom: auto; right: auto; margin: 0;}
#topVoiceSlide .pager .arrow button::after,
#topSeminarSlide .pager .arrow button::after{ content: none;}
#topVoiceSlide .pager .arrow button.swiper-button-prev .wrapIcon,
#topSeminarSlide .pager .arrow button.swiper-button-prev .wrapIcon{ display: block; width: 15px; height: 15px; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); overflow: hidden;}
#topVoiceSlide .pager .arrow button.swiper-button-prev .icon,
#topSeminarSlide .pager .arrow button.swiper-button-prev .icon{ display: block; width: 100%; height: 100%; transition: all ease 0.6s;}
#topVoiceSlide .pager .arrow button.swiper-button-prev .icon::before,
#topSeminarSlide .pager .arrow button.swiper-button-prev .icon::before{ content: ""; display: block; width: 100%; background-color: #fff; height: 1px; position: absolute; top: 50%; left: 0; transform: translateY(-50%); }
#topVoiceSlide .pager .arrow button.swiper-button-prev .icon::after,
#topSeminarSlide .pager .arrow button.swiper-button-prev .icon::after{ content: ""; display: block; width: 7px; height: 7px; border-top: 1px solid #fff; border-left: 1px solid #fff; position: absolute; left: 1px; top: 50%; transform: translateY(-50%) rotate(-45deg); }
#topVoiceSlide .pager .arrow button.swiper-button-prev.swiper-button-disabled,
#topSeminarSlide .pager .arrow button.swiper-button-prev.swiper-button-disabled{ opacity: 1; background-color: #fff;}
#topVoiceSlide .pager .arrow button.swiper-button-prev.swiper-button-disabled .icon::before,
#topSeminarSlide .pager .arrow button.swiper-button-prev.swiper-button-disabled .icon::before{ background-color: var(--navy);}
#topVoiceSlide .pager .arrow button.swiper-button-prev.swiper-button-disabled .icon::after,
#topSeminarSlide .pager .arrow button.swiper-button-prev.swiper-button-disabled .icon::after{ border-top: 1px solid var(--navy); border-left: 1px solid var(--navy);}
#topVoiceSlide .swiper-scrollbar,
#topSeminarSlide .swiper-scrollbar{ background-color: var(--gray); height: 1px; width: calc(100% - calc(min(var(--comp-75), 50px) * 2 + min(var(--comp-30), 30px)) - min(var(--comp-60), 110px) - 1px); order: 1; position: relative; top: auto; left: auto; right: auto; bottom: auto; flex: 1;}
#topVoiceSlide .swiper-scrollbar-drag,
#topSeminarSlide .swiper-scrollbar-drag { background-color: var(--navy);}
#topVoiceSlide .pager .arrow button.swiper-button-next .wrapIcon,
#topSeminarSlide .pager .arrow button.swiper-button-next .wrapIcon{ display: block; width: 15px; height: 15px; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); overflow: hidden;}
#topVoiceSlide .pager .arrow button.swiper-button-next .icon,
#topSeminarSlide .pager .arrow button.swiper-button-next .icon{ display: block; width: 100%; height: 100%; transition: all ease 0.6s;}
#topVoiceSlide .pager .arrow button.swiper-button-next .icon::before,
#topSeminarSlide .pager .arrow button.swiper-button-next .icon::before{ content: ""; display: block; width: 100%; background-color: #fff; height: 1px; position: absolute; top: 50%; left: 0; transform: translateY(-50%); }
#topVoiceSlide .pager .arrow button.swiper-button-next .icon::after,
#topSeminarSlide .pager .arrow button.swiper-button-next .icon::after{ content: ""; display: block; width: 7px; height: 7px; border-top: 1px solid #fff; border-right: 1px solid #fff; position: absolute; right: 1px; top: 50%; transform: translateY(-50%) rotate(45deg); }
#topVoiceSlide .pager .arrow button.swiper-button-next.swiper-button-disabled,
#topSeminarSlide .pager .arrow button.swiper-button-next.swiper-button-disabled{ opacity: 1; background-color: #fff;}
#topVoiceSlide .pager .arrow button.swiper-button-next.swiper-button-disabled .icon::before,
#topSeminarSlide .pager .arrow button.swiper-button-next.swiper-button-disabled .icon::before{ background-color: var(--navy);}
#topVoiceSlide .pager .arrow button.swiper-button-next.swiper-button-disabled .icon::after,
#topSeminarSlide .pager .arrow button.swiper-button-next.swiper-button-disabled .icon::after{ border-top: 1px solid var(--navy); border-right: 1px solid var(--navy);}

@media (any-hover: hover) {
#topVoiceSlide .pager .arrow button:hover,
#topSeminarSlide .pager .arrow button:hover{ background-color: #fff;}
#topVoiceSlide .pager .arrow button.swiper-button-prev:hover .icon,
#topSeminarSlide .pager .arrow button.swiper-button-prev:hover .icon{animation: slideOutIn-re 0.5s ease forwards; }
#topVoiceSlide .pager .arrow button.swiper-button-prev:hover .icon::before,
#topSeminarSlide .pager .arrow button.swiper-button-prev:hover .icon::before{ background-color: var(--navy);}
#topVoiceSlide .pager .arrow button.swiper-button-prev:hover .icon::after,
#topSeminarSlide .pager .arrow button.swiper-button-prev:hover .icon::after{ border-top: 1px solid var(--navy); border-left: 1px solid var(--navy);}
#topVoiceSlide .pager .arrow button.swiper-button-next:hover .icon,
#topSeminarSlide .pager .arrow button.swiper-button-next:hover .icon{animation: slideOutIn 0.5s ease forwards; }
#topVoiceSlide .pager .arrow button.swiper-button-next:hover .icon::before,
#topSeminarSlide .pager .arrow button.swiper-button-next:hover .icon::before{ background-color: var(--navy);}
#topVoiceSlide .pager .arrow button.swiper-button-next:hover .icon::after,
#topSeminarSlide .pager .arrow button.swiper-button-next:hover .icon::after{ border-top: 1px solid var(--navy); border-right: 1px solid var(--navy);}
}

@media screen and (width <= 1400px){
#topKomonVoice .ttlType01,
#topSeminar .ttlType01{ order: 1; width: var(--comp-580); margin-left: auto; margin-right: auto;}
#topKomonVoice .innerTopKomonVoice .textBox,
#topSeminar .innerTopSeminar .textBox{ display: contents;}
#topKomonVoice .innerTopKomonVoice,
#topSeminar .innerTopSeminar{ display: flex; align-items: flex-start; justify-content: space-between; gap: 0; width: 100%; flex-wrap: wrap;}
#topKomonVoice .innerTopKomonVoice .textBox .innerTextBox,
#topSeminar .innerTopSeminar .textBox .innerTextBox{ display: contents;}
#topKomonVoice .innerTopKomonVoice .textBox .innerTextBox .btnType01,
#topSeminar .innerTopSeminar .textBox .innerTextBox .btnType01{ order: 3; margin: 0 auto;}

/*Slider*/
#topKomonVoice .wrapTopVoiceSlide,
#topSeminar .wrapTopSeminarSlide{ width: 100%; order: 2; padding-left: calc((100% - var(--comp-580)) / 2); margin-bottom: min(var(--comp-80), 80px);}
#topVoiceSlide.swiper .swiper-container,
#topSeminarSlide.swiper .swiper-container{ width: 41vw;}
}

@media screen and (width <= 800px){
#topSeminar{ background-image: url(../img/top/bg-seminar-sp.webp), url(../img/common/bg-texture-02.jpg); background-repeat: no-repeat, repeat; background-position: center bottom, center top; background-size: 100%, auto; padding-bottom: var(--comp-400);}

/*Slider*/
#topKomonVoice .wrapTopVoiceSlide,
#topSeminar .wrapTopSeminarSlide{ width: 100%; order: 2; padding-left: calc((100% - var(--comp-580)) / 2); margin-bottom: min(var(--comp-80), 80px);}
#topVoiceSlide.swiper .swiper-container,
#topSeminarSlide.swiper .swiper-container{ width: var(--comp-540);}
#topVoiceSlide.swiper .swiper-container:has( + .pager:not([style*="display: display"])), 
#topSeminarSlide.swiper .swiper-container:has( + .pager:not([style*="display: display"])){ width: var(--comp-580);}
#topVoiceSlide.swiper .swiper-wrapper:not(:has( > .swiper-slide:nth-child(3))),
#topSeminarSlide.swiper .swiper-wrapper:not(:has( > .swiper-slide:nth-child(3))){ display: flex; flex-wrap: wrap; gap: min(var(--comp-80), 80px); }
#topVoiceSlide.swiper .swiper-wrapper:not(:has( > .swiper-slide:nth-child(3))) > .swiper-slide,
#topSeminarSlide.swiper .swiper-wrapper:not(:has( > .swiper-slide:nth-child(3)))  > .swiper-slide{ padding: 0;}
#topVoiceSlide .pager,
#topSeminarSlide .pager{ width: var(--comp-580); margin: min(var(--comp-50), 50px) auto 0 0; flex-wrap: nowrap;}
#topVoiceSlide .swiper-scrollbar,
#topSeminarSlide .swiper-scrollbar{ flex: 1;}
#topVoiceSlide .pager .arrow button.swiper-button-prev .wrapIcon,
#topSeminarSlide .pager .arrow button.swiper-button-prev .wrapIcon{ width: var(--comp-15); height: var(--comp-15); }
#topVoiceSlide .pager .arrow button.swiper-button-prev .icon::after,
#topSeminarSlide .pager .arrow button.swiper-button-prev .icon::after{ width: var(--comp-7); height: var(--comp-7); }
#topVoiceSlide .pager .arrow button.swiper-button-next .wrapIcon,
#topSeminarSlide .pager .arrow button.swiper-button-next .wrapIcon{ width: var(--comp-15); height: var(--comp-15); }
#topVoiceSlide .pager .arrow button.swiper-button-next .icon::after,
#topSeminarSlide .pager .arrow button.swiper-button-next .icon::after{ width: var(--comp-7); height: var(--comp-7); }
}


/*
 TOP PROFILE
--------------------------------*/
#topProfile{ background-image: url(../img/common/bg-texture-03.jpg); background-repeat: repeat; background-position: center top;  padding: min(var(--comp-160), 160px) 0; }
#topProfile .innerTopProfile{ width: min(var(--comp-580), 1280px); margin: 0 auto;}
#topProfile .ttlType01{ margin: 0 auto min(var(--comp-80), 60px);}
#topProfile .ttlType01 .ja{ color: #fff;  }
#topProfile .ttlType01 .en{ color: var(--darkgray);  }
#topProfile .topProfileFlexBox{ display: block; width: min(95%, 1160px); margin: 0 0 0 auto; overflow: hidden;}
#topProfile .topProfileFlexBox figure{ width: 46%; max-width: 560px; float: right; margin: 0 0 min(var(--comp-60), 60px) min(var(--comp-80), 80px);}
#topProfile .topProfileFlexBox .textBox{ display: contents;}
#topProfile .topProfileFlexBox .textBox .text{ color: #fff; font-size: min(var(--comp-24), 16px); margin: 0 auto min(var(--comp-155), 60px);}

@media screen and (width <= 1100px){
#topProfile .btnType01{ margin: 0 auto;}
#topProfile .topProfileFlexBox{ width: 100%; display: flex; flex-wrap: wrap; gap: min(var(--comp-80), 80px); flex-direction: row-reverse;}
#topProfile .topProfileFlexBox figure{ width: 100%; max-width: 100%; aspect-ratio: 4 / 3; overflow: hidden; margin: 0;}
#topProfile .topProfileFlexBox figure img{ width: 100%; height: 100%; object-fit: cover;}
#topProfile .topProfileFlexBox .textBox{ width: 100%; max-width: 100%; display: block;}
}

@media screen and (width <= 800px){
#topProfile .topProfileFlexBox figure{ width: 100%; max-width: 100%; aspect-ratio: 1 / 1;}
}

/*
 TOP NEWS
--------------------------------*/
#topNews{ background-image: url(../img/common/bg-texture-01.jpg); background-repeat: repeat; background-position: center top;  padding: min(var(--comp-160), 160px) 0;}
#topNews .innerTopNews{ display: flex; width: min(var(--comp-580), 1280px); margin: 0 auto;}
#topNews .innerTopNews .textBox .ttlType01{ margin: 0 auto min(var(--comp-80), 60px);}
#topNews .innerTopNews .textBox .ttlType01 .ja{ color: var(--navy);  }
#topNews .innerTopNews .textBox .ttlType01 .en{ color: var(--darkgray);  }
#topNews .innerTopNews .textBox{ width: 320px; }
#topNews .innerTopNews .topNewsSortBox{ width: calc(100% - 320px); }

/*topNewsSortList*/
#topNews .topNewsSortList{ display: flex; flex-wrap: wrap; gap: min(var(--comp-20), 15px); max-width: 240px;}
#topNews .topNewsSortList li{ width: 100%;}
#topNews .topNewsSortList li button{ display: block; width: 100%; background-color: var(--blue); color: #fff; font-family: var(--zen-old); font-weight: 500; color: #fff; font-size: min(var(--comp-24), 16px); box-sizing: border-box; padding: min(var(--comp-25), 15px) min(var(--comp-60), 50px) min(var(--comp-25), 20px) min(var(--comp-30), 30px); position: relative; transition: all ease 0.7s;}
#topNews .topNewsSortList li.active button{ background-color: var(--navy);}
#topNews .topNewsSortList li button .wrapIcon{ display: block; width: 15px; height: 15px; position: absolute; top: 50%; transform: translateY(-50%); right: min(var(--comp-40), 30px); overflow: hidden;}
#topNews .topNewsSortList li button .icon{ display: block; width: 100%; height: 100%; position: relative; transition: all ease 0.6s; overflow: hidden;}
#topNews .topNewsSortList li button .icon::before{ content: ""; display: block; width: 100%; background-color: #fff; height: 1px; position: absolute; top: 50%; left: 0; transform: translateY(-50%); }
#topNews .topNewsSortList li button .icon::after{ content: ""; display: block; width: 7px; height: 7px; border-top: 1px solid #fff; border-right: 1px solid #fff; position: absolute; right: 1px; top: 50%; transform: translateY(-50%) rotate(45deg); }

@media (any-hover: hover) {
#topNews .topNewsSortList li button:hover .icon{animation: slideOutIn 0.5s ease forwards; }
}

@media screen and (width <= 800px){
#topNews .innerTopNews{ flex-wrap: wrap;}
#topNews .innerTopNews .textBox{ width: 100%; }
#topNews .innerTopNews .topNewsSortBox{ width: 100%; }

/*topNewsSortList*/
#topNews .topNewsSortList{ display: flex; flex-wrap: wrap; gap: min(var(--comp-20), 15px); max-width: 100%; margin: 0 auto min(var(--comp-80), 80px);}
#topNews .topNewsSortList li{ width: calc((100% - min(var(--comp-20), 15px) - 1px) / 2);}
#topNews .topNewsSortList li button .wrapIcon{ width: var(--comp-15); height: var(--comp-15); transform: translateY(-50%) rotate(90deg); }
#topNews .topNewsSortList li button .icon::after{ width: var(--comp-7); height: var(--comp-7); }
}

/*.topNewsSortBox*/
#topNews .topNewsSortBox > div{ display: none;}
#topNews .topNewsSortBox > div.all{ display: block;}
#topNews .topNewsSortBox > div ul{ display: block; overflow-y: auto; max-height: min(171vw, 750px);}
#topNews .topNewsSortBox > div ul::-webkit-scrollbar { background: transparent; width: min(var(--comp-10), 10px); height: min(var(--comp-10), 10px);}
#topNews .topNewsSortBox > div ul::-webkit-scrollbar-thumb { background-color: var(--gray);}
#topNews .topNewsSortBox > div ul li{ border-bottom: 1px solid var(--gray);}
#topNews .topNewsSortBox > div ul li:first-child{ border-top: 1px solid var(--gray);}
#topNews .topNewsSortBox > div ul li a{ display: block; padding: min(var(--comp-45), 40px) min(var(--comp-10), 10px) min(var(--comp-45), 40px) 0; position: relative;}
#topNews .topNewsSortBox > div ul li a::before{ content: ""; display: block; height: 1px; position: absolute; bottom: -1px; left: 0; transform: scaleX(0); transform-origin: top right; transition: transform 0.7s ease; background-color: var(--navy); width: 100%; height: 1px;}
#topNews .topNewsSortBox > div ul li a .data{ font-family: var(--zen-old); font-weight: 500; margin: 0 auto min(var(--comp-15), 15px);}
#topNews .topNewsSortBox > div ul li a .data .date{ color: var(--darkgray); font-size: min(var(--comp-24), 16px); line-height: 1; display: inline-block; }
#topNews .topNewsSortBox > div ul li a .data .cate{ color: #fff; font-size: min(var(--comp-24), 16px); display: inline-block; background-color: var(--blue); line-height: 1; width: 6em; padding: min(var(--comp-10), 6px) 0; text-align: center; margin-left: min(var(--comp-15), 15px); }
#topNews .topNewsSortBox > div ul li a .ttl{ color: var(--navy); font-size: min(var(--comp-24), 16px); line-height: 1.8;}

@media (any-hover: hover) {
#topNews .topNewsSortBox > div ul li a:hover{ opacity: 1;}
#topNews .topNewsSortBox > div ul li a:hover::before{ transform: scaleX(100%); transform-origin: top left;}
}



/*--------------------------------------------------------------------------------------------

ANIMATION

--------------------------------------------------------------------------------------------*/
.fadein{ opacity: 0;}
.fadein.scrollin{ animation: openingSlideIn 1.5s ease forwards; animation-delay: 0.2s;}

@keyframes slideOutIn-Rotate {
0% { transform: translateX(0%) translateY(-50%) rotate(45deg); }
40% { transform: translateX(200%) translateY(-50%) rotate(45deg); }
40.0001% { transform: translateX(-200%) translateY(-50%) rotate(45deg); }
60% { transform: translateX(-200%) translateY(-50%) rotate(45deg); }
100% { transform: translateX(0%) translateY(-50%) rotate(45deg); }
}

@keyframes slideOutIn {
0% { transform: translateX(0%); }
40% { transform: translateX(110%); }
40.0001% { transform: translateX(-110%); }
60% { transform: translateX(-110%); }
100% { transform: translateX(0%); }
}

@keyframes slideOutIn-re {
0% { transform: translateX(0%); }
40% { transform: translateX(-110%); }
40.0001% { transform: translateX(110%); }
60% { transform: translateX(110%); }
100% { transform: translateX(0%); }
}

@keyframes slideOutIn-tb {
0% { transform: translateY(0%); }
40% { transform: translateY(-110%); }
40.0001% { transform: translateY(110%); }
60% { transform: translateY(110%); }
100% { transform: translateY(0%); }
}

@keyframes openingFadeIn {
0% { opacity: 0;}
100% { opacity: 1;}
}

@keyframes openingSlideIn {
0% { transform: translateY(min(var(--comp-20), 20px)); opacity: 0;}
100% { transform: translateY(0); opacity: 1;}
}

@keyframes slideOutInCF {
0% { background-position: 0% center; }
40% { background-position: 110% center; }
40.0001% { background-position: -110% center; }
60% { background-position: -110% center; }
100% { background-position: 0% center; }
}

@keyframes slideOutInCF-re {
0% { background-position: 0% center; }
40% { background-position: calc(min(var(--comp-20), 15px)*(-1) - 1px) center; }
40.0001% { background-position: calc(min(var(--comp-20), 15px) + 1px) center; }
60% { background-position: calc(min(var(--comp-20), 15px) + 1px) center; }
100% { background-position: 0% center; }
}

@keyframes pagerarrow {
0% { background-position: 0% center; }
40% { background-position: calc(min(var(--comp-25), 18px) * (-1) - 1px) center; }
40.0001% { background-position: calc(min(var(--comp-25), 18px) + 1px) center; }
60% { background-position: calc(min(var(--comp-25), 18px) + 1px) center; }
100% { background-position: 0% center; }
}

@keyframes pagerarrow-re {
0% { background-position: 0% center; }
40% { background-position: calc(min(var(--comp-25), 18px) + 1px) center;}
40.0001% { background-position: calc(min(var(--comp-25), 18px) * (-1) - 1px) center; }
60% { background-position: calc(min(var(--comp-25), 18px) * (-1) - 1px) center; }
100% { background-position: 0% center; }
}


/*--------------------------------------------------------------------------------------------

SECOND

--------------------------------------------------------------------------------------------*/
/*
 BASE
--------------------------------*/
/*-- box --*/
.wrapSecondBody{ padding-top: calc(min(var(--comp-30), 30px) + min(var(--comp-30), 30px) + min(var(--comp-90), 60px));}
#secondContainer{ display: flex; flex-direction: row-reverse; gap: min(var(--comp-80), 80px); width: min(var(--comp-580), 1280px); margin: 0 auto min(var(--comp-160), 160px);}
#secondContainer aside{ display: block; width: 300px;}
#secondContainer aside section,
#secondContainer aside .wrapSide{ margin: min(var(--comp-60), 60px) 0; width: 100%;}
#secondContainer aside section:first-child,
#secondContainer aside .wrapSide:first-child{ margin-top: 0;}
#secondContainer aside section:last-child,
#secondContainer aside .wrapSide:last-child{ margin-top: 0;}
#secondContainer aside section h3,
#secondContainer aside .wrapSide h3{ font-size: min(var(--comp-38), 26px); font-family: var(--zen-old); color: var(--blue); font-weight: 500; line-height: 1.6; margin: 0 auto min(var(--comp-25), 25px);}
#secondContainer .sideBnrList{ display: flex; flex-wrap: wrap; gap: min(var(--comp-20), 20px);}
#secondContainer .sideBnrList > li{ width: 100%;}
#secondContainer .sideBnrList > li a{ display: block; width: 100%;}
#secondContainer .sideTextList{ border-top: 1px solid var(--gray);}
#secondContainer .sideTextList > li{ border-bottom: 1px solid var(--gray); }
#secondContainer .sideTextList > li a{ display: block; padding: min(var(--comp-20), 20px) 0; font-family: var(--zen-old); font-weight: 500; position: relative; line-height: 1.6;}
#secondContainer .sideTextList > li a::before{ content: ""; display: block; height: 1px; position: absolute; bottom: -1px; left: 0; transform: scaleX(0); transform-origin: top right; transition: transform 0.7s ease; background-color: var(--navy); width: 100%; height: 1px;}
#secondContent{ width: calc(100% - 300px - min(var(--comp-80), 80px)); margin: 0 auto;}

/*-- heading --*/
/*.pageHeaderBox*/
.pageHeaderBox{ background-image: url(../img/common/bg-texture-02.jpg); background-repeat: repeat; background-position: center top; padding: min(var(--comp-155), 145px) 0 min(var(--comp-80), 80px);}
.pageHeaderBox .innerPageHeader{ width: min(var(--comp-580), 1280px); margin: 0 auto;}
.pageHeaderBox .ttlType01 .ja{ color: #fff;}

/*-- Search & Finlter --*/
.pageHeaderBox #searchBox{ border-top: 1px solid var(--darkgray); padding-top: min(var(--comp-80), 75px); display: flex; align-items: center; gap: min(var(--comp-40), 40px);}
.pageHeaderBox #searchBox .searchandfilter{ width: min(79.6875%, 1020px);}
.pageHeaderBox #searchBox .searchandfilter > div > ul{ display: flex; color: #fff; font-family: var(--zen-old); justify-content: space-between; font-size: min(var(--comp-26), 18px);}
.pageHeaderBox #searchBox .searchandfilter > div > ul > li:nth-child(1),
.pageHeaderBox #searchBox .searchandfilter > div > ul > li:nth-child(2){ width: min(39.2156862%, 400px);}
.pageHeaderBox #searchBox .searchandfilter > div > ul > li:nth-child(3){ width: min(17.6470588%, 180px);}
.pageHeaderBox #searchBox .searchandfilter > div > ul > li{ position: relative; padding: 0;}
.pageHeaderBox #searchBox .searchandfilter select{ background-color: var(--navy); width: 100%; box-sizing: border-box; padding: min(var(--comp-40), 30px)}
.pageHeaderBox #searchBox .searchandfilter select option{ box-sizing: border-box; padding: min(2.027027027027027vw, 10px) min(5.405405405405405vw, 30px);}
.pageHeaderBox #searchBox .searchandfilter > div > ul > li:nth-child(1)::before,
.pageHeaderBox #searchBox .searchandfilter > div > ul > li:nth-child(2)::before{ content: ""; display: block; width: min(var(--comp-10), 8px); height: min(var(--comp-10), 8px); border-bottom: 1px solid #fff; border-right: 1px solid #fff; position: absolute; top: 50%; right: min(var(--comp-40), 30px); transform: translateY(-50%) rotate(45deg); pointer-events: none;}
.pageHeaderBox #searchBox .searchandfilter > div > ul > li:nth-child(3) input{ width: 100%; background-color: #0063BE; padding: min(var(--comp-40), 30px); box-sizing: border-box; }
.pageHeaderBox #searchBox .searchandfilter > div > ul > li:nth-child(3)::after{ content: ""; position: absolute; top: calc(50% - (min(var(--comp-15), 10px)/2)); right: min(var(--comp-45), 30px); width: min(var(--comp-20), 15px); height: min(var(--comp-15), 10px); background-image: url(../img/common/arrow-l.svg); background-size: contain; background-repeat: no-repeat; background-position: center top; transform: translateY(-50%) translateX(0%); transition: background-position 0.3s ease; pointer-events: none; transform: rotate(180deg); display: block; }
.pageHeaderBox #searchBox #clearButton{  color: #fff; font-family: var(--zen-old); font-size: min(var(--comp-26), 18px); position: relative; padding-right: min(var(--comp-70), 50px); width: min( );}
.pageHeaderBox #searchBox #clearButton .icon{ display: block; background-image: url(../img/common/icon-close.svg); width: min(var(--comp-45), 30px); aspect-ratio: 1 / 1; position: absolute; top: 50%; right: 0; transform: translateY(-50%); line-height: 1;}

@media (any-hover: hover) {
.pageHeaderBox #searchBox .searchandfilter > div > ul > li:nth-child(3):has(> input:hover)::after{ animation: slideOutInCF-re 0.5s ease forwards;}
.pageHeaderBox #searchBox .searchandfilter > div > ul > li:nth-child(1),
.pageHeaderBox #searchBox .searchandfilter > div > ul > li:nth-child(2){ width: 39.2156862%;}
.pageHeaderBox #searchBox .searchandfilter > div > ul > li:nth-child(3){ width: 17.6470588%;}
}

@media screen and (width <= 1480px){
.pageHeaderBox #searchBox{ flex-wrap: wrap; }
.pageHeaderBox #searchBox .searchandfilter{ width: 100%;}
.pageHeaderBox #searchBox #clearButton{ margin: 0 min(var(--comp-30), 30px) 0 auto;}
}

@media screen and (width <= 900px){
.pageHeaderBox #searchBox .searchandfilter > div > ul{ flex-wrap: wrap; gap: min(var(--comp-20), 20px);}
.pageHeaderBox #searchBox .searchandfilter > div > ul > li:nth-child(1),
.pageHeaderBox #searchBox .searchandfilter > div > ul > li:nth-child(2){ width: 100%;}
.pageHeaderBox #searchBox .searchandfilter > div > ul > li:nth-child(3){ width: 100%;}
}

/*-- breadcrumbs --*/
.breadcrumbsBox{ padding: min(var(--comp-40), 35px) 0 0; margin: 0 auto min(var(--comp-85), 80px); width: min(var(--comp-580), 1280px); box-sizing: border-box; line-height: 2;}
.breadcrumbsBox .aioseo-breadcrumbs{ font-size: min(var(--comp-22), 14px); font-family: var(--base-font); overflow: hidden; position: relative;}
.breadcrumbsBox .aioseo-breadcrumbs span:not(:last-child){ margin-right: min(var(--comp-10), 15px);}
.breadcrumbsBox .aioseo-breadcrumbs span a{ color: var(--darkgray);}
.breadcrumbsBox .aioseo-breadcrumbs .aioseo-breadcrumb-separator{ display: inline-block; width: min(var(--comp-30), 30px); font-size: 0; background-color: var(--gray); height: 1px; vertical-align: middle;}

@media (any-hover: hover) {
#secondContainer .sideTextList > li a:hover{ opacity: 1;}
#secondContainer .sideTextList > li a:hover::before{ transform: scaleX(100%); transform-origin: top left;}
}

@media screen and (width <= 1280px){
/*-- heading --*/
/*.pageHeaderBox*/
#secondContainer aside{ display: none;}
#secondContent{ width: 100%;}
}

@media screen and (width <= 800px){
/*-- box --*/
#secondContainer{ width: min(var(--comp-660), 1280px);}

/*-- heading --*/
/*.pageHeaderBox*/
#secondContainer aside{ display: none;}
#secondContent{ width: 100%;}

/*-- breadcrumbs --*/
.breadcrumbsBox{ width: min(var(--comp-660), 1280px);}
}


/*
 ARCHIVE
--------------------------------*/
#secondContent .linkListtype03{ display: flex; gap: min(var(--comp-75), 60px); flex-wrap: wrap; margin: min(var(--comp-75), 60px) auto;}
#secondContent .linkListtype03:first-child{ margin-top: 0;}
#secondContent .linkListtype03 li{ width: 100%; border-bottom: 1px solid var(--gray); padding-bottom: min(var(--comp-75), 60px); }
#secondContent .linkListtype03 li a{ display: flex; position: relative; gap: min(var(--comp-35), 40px); justify-content: space-between; align-items: flex-start;}
#secondContent .linkListtype03 li figure{ width: min(33.33333%, 300px); overflow: hidden; display: block; aspect-ratio: 600 / 420;}
#secondContent .linkListtype03 li figure img{ transition: all 0.5s ease; object-fit: cover; width: 100%; height: 100%;}
#secondContent .linkListtype03 li .textBox{ width: calc(100% - min(33.33333%, 300px) - min(var(--comp-35), 40px));}
#secondContent .linkListtype03 li .date{ font-size: min(var(--comp-24), 16px); color: var(--darkgray); margin: 0 auto min(var(--comp-30), 20px); line-height: 1; transition: all 0.5s ease;}
#secondContent .linkListtype03 li .ttl{ color: var(--blue); font-size: min(var(--comp-34), 22px); line-height: 1.8; font-weight: 500; margin: 0 auto min(var(--comp-25), 25px); text-decoration: none; color: var(--blue); letter-spacing: 0.02em; transition: all 0.5s ease; font-feature-settings: "palt"; letter-spacing: 0.08em;} 
#secondContent .linkListtype03 li .text{ margin: 0 auto; letter-spacing: 0.02em; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden;}

#secondContent .archivePager{ display: flex; justify-content: flex-end; gap: min(var(--comp-40), 40px);}
#secondContent .archivePager p{ display: inline-block; margin: 0 !important; width: auto;}
#secondContent .archivePager p a{ color: var(--base-font-color); text-decoration: none;}
#secondContent .archivePager p.new a::before,
#secondContent .archivePager p.old a::after{ content: ""; display: inline-block; vertical-align: middle; width: min(var(--comp-25), 18px); height: min(var(--comp-25), 18px);}
#secondContent .archivePager p.new a::before{  background-image: url(../img/common/arrow-l-bk.svg); background-size: contain; background-position: 0 center;  background-repeat: no-repeat; margin-right: min(var(--comp-20), 15px);}
#secondContent .archivePager p.old a::after{ background-image: url(../img/common/arrow-r-bk.svg); background-size: contain; background-position: 0 center; background-repeat: no-repeat; margin-left: min(var(--comp-20), 15px);}
#secondContent .archivePager p.new:empty,
#secondContent .archivePager p.old:empty{ display: none;}

@media (any-hover: hover) {
#secondContent .linkListtype03 li a:hover{ opacity: 1;}
#secondContent .linkListtype03 li a:hover figure img{ transform: scale(1.05);}
#secondContent .linkListtype03 li a:hover .date{ opacity: 0.7;}
#secondContent .linkListtype03 li a:hover .ttl{ opacity: 0.7;}
#secondContent .archivePager p a:hover{ opacity: 1;}
#secondContent .archivePager p.new a:hover::before{ animation: pagerarrow 0.5s ease forwards;}
#secondContent .archivePager p.old a:hover::after{ animation: pagerarrow-re 0.5s ease forwards;}
}

@media screen and (width <= 800px){
#secondContent .linkListtype03{ width: 100%; max-width: 100%;}
#secondContent .linkListtype03 li a{ display: block;}
#secondContent .linkListtype03 li figure{ width: 100%; margin-bottom: min(var(--comp-35), 35px);}
#secondContent .linkListtype03 li .textBox{ width: 100%;}

#secondContent .archivePager{ justify-content: space-between; width: 100%; margin: 0 auto;}
#secondContent .archivePager:has( > p.old:empty){justify-content: flex-start;}
#secondContent .archivePager:has( > p.new:empty){justify-content: flex-end;}
}


/*
 CONTENT
--------------------------------*/
/*-- 目次 --*/
#ez-toc-container{ background-color: #EBF3FA !important; width: 100% !important; border: none !important; border-radius: 0 !important; -webkit-box-shadow: 0 0 0 rgba(0, 0, 0, 0) !important; box-shadow: 0 0 0 rgba(0, 0, 0, 0) !important; display: block !important;  padding: 0 min(var(--comp-35), 40px) 0 !important; position: relative; font-family: var(--base-font); margin-bottom: min(var(--comp-80), 80px) !important;}
#ez-toc-container:has( > #secondContent h2 > span.ez-toc-section){ margin-bottom: calc(min(var(--comp-160), 160px) - min(var(--comp-30), 30px)); }
#ez-toc-container .ez-toc-title{ text-align: left !important; line-height: 1.45 !important;  margin: 0 !important; padding: min(var(--comp-40), 40px) 0 !important; font-size: min(var(--comp-26), 18px) !important; font-weight: 400 !important; color: var(--base-font-color) !important; display: block !important;}
div#ez-toc-container .ez-toc-title{ font-weight: 400 !important;}
#ez-toc-container .ez-toc-js-icon-con{ border: none !important;}
#ez-toc-container .ez-toc-title-toggle{ width: min(var(--comp-25), 17px) !important; height: min(var(--comp-25), 17px) !important; position: absolute !important; cursor: pointer !important; top: calc(min(var(--comp-40), 40px) + (min(var(--comp-26), 18px) / 2)) !important; right: min(var(--comp-35), 40px) !important; transition: transform ease 0.5s;}
#ez-toc-container .ez-toc-title-toggle svg{ display: none !important; }
#ez-toc-container .ez-toc-title-toggle::before{ content: ""; display: block; width: 100%; height: 1px; position: absolute; top: calc(50% - 0.5px); left: 0; background-color: var(--blue);}
#ez-toc-container .ez-toc-title-toggle::after{ content: ""; display: block; width: 1px; height: 100%; position: absolute; left: calc(50% - 0.5px); top: 0; background-color: var(--blue); transition: transform ease 0.5s; transform: scaleY(0); opacity: 0;}
#ez-toc-container nav{ display: block; }
#ez-toc-container nav > ul{ border-top: 1px solid var(--gray); box-sizing: border-box; padding: min(var(--comp-40), 40px) 0;}
#ez-toc-container ul{ list-style: none !important; line-height: 1.8 !important; margin: 0 !important; overflow: hidden; box-sizing: border-box !important; display: block;}
#ez-toc-container ul > li{ width: 100% !important; margin-bottom: 1.4em !important;}
#ez-toc-container ul li:last-child{ margin-bottom: 0 !important;}
#ez-toc-container ul > li{ font-size: min(var(--comp-24), 16px) !important;}
#ez-toc-container ul > li a{ color: var(--base-font-color) !important;}
#ez-toc-container ul > li ul{ padding-left: min(var(--comp-40), 30px) !important; margin-top: 1em !important; display: flex !important; flex-wrap: wrap !important; gap: 0.6em !important; font-weight: 400 !important;}
#ez-toc-container ul > li > ul > li{ font-size: min(var(--comp-22), 14px) !important; margin: 0 !important;}
#ez-toc-container ul > li > ul > li > ul > li{ font-size: min(var(--comp-20), 12px) !important; margin: 0 !important;}
#ez-toc-container a:visited{ color: var(--base-font-color) !important;}
#secondContent p + #ez-toc-container{ margin-top: min(var(--comp-80), 80px) !important;}
div#ez-toc-container .ez-toc-title{ font-size: 1em; font-size: min(var(--comp-26), 18px) !important;}
div#ez-toc-container ul li, div#ez-toc-container ul li a{ font-weight: 400 !important;}
#ez-toc-container ul ul, .ez-toc div.ez-toc-widget-container ul ul{ margin-left: 0 !important;}
#ez-toc-container:has( nav > .ez-toc-list[style*="display: none"]) .ez-toc-title-toggle{ transform: rotate(180deg);}
#ez-toc-container:has( nav > .ez-toc-list[style*="display: none"]) .ez-toc-title-toggle::after{ transform: scaleY(1); opacity: 1; }

@media (any-hover: hover) {
#ez-toc-container a:hover{ text-decoration: none;}
}


/*-- heading --*/
#secondContent h2{ color: var(--blue); font-weight: 500; font-family: var(--base-font); text-align: left; font-size: min(var(--comp-46), 34px); line-height: 1.6; border-bottom: 2px solid var(--blue); padding-bottom: min(var(--comp-30), 25px); margin: min(var(--comp-160), 160px) auto min(var(--comp-80), 60px); overflow: hidden;} 
#secondContent h2.simplePostTtl{ border-bottom: none;}
#secondContent h3{ color: var(--base-font-color); font-weight: 600; font-family: var(--base-font); text-align: left; font-size: min(var(--comp-38), 26px); line-height: 1.6; border-bottom: 1px solid var(--gray); padding-bottom: min(var(--comp-30), 25px); margin:min(var(--comp-120), 120px) auto min(var(--comp-80), 60px);}
#secondContent h4{ color: var(--blue); font-weight: 500; font-family: var(--base-font); text-align: left; font-size: min(var(--comp-34), 22px); line-height: 1.6;  padding-bottom: min(var(--comp-30), 25px); margin: min(var(--comp-80), 55px) auto min(var(--comp-35), 25px); position: relative;}
#secondContent h4::after{ content: ""; display: block; height: 1px; width: min(var(--comp-40), 30px); position: absolute; bottom: 0; left: 0; background-color: var(--gray);}
#secondContent h5{ color: var(--base-font-color); font-weight: 600; font-family: var(--base-font); text-align: left; font-size: min(var(--comp-30), 18px); line-height: 1.6; margin: min(var(--comp-60), 50px) auto min(var(--comp-20), 15px); position: relative; padding-bottom: min(var(--comp-15), 20px);}
#secondContent h5::after{ content: ""; display: block; height: 1px; width: min(var(--comp-30), 25px); position: absolute; bottom: 0; left: 0; background-color: var(--gray);}
#secondContent h6{ color: var(--base-font-color); font-weight: 600; font-family: var(--base-font); text-align: left; font-size: min(var(--comp-26), 16px); line-height: 1.6; margin: min(var(--comp-40), 30px) auto min(var(--comp-10), 10px); position: relative;}
#secondContent h2 > span.ez-toc-section,
#secondContent h3 > span.ez-toc-section{ padding-top: min(var(--comp-30), 30px); margin-top: calc( min(var(--comp-30), 30px) * (-1)); display: block; box-sizing: border-box;}
#secondContent h2:has( > span.ez-toc-section){ margin-top: calc(min(var(--comp-160), 160px) - min(var(--comp-30), 30px));}
#secondContent h3:has( > span.ez-toc-section){ margin-top: calc(min(var(--comp-120), 120px) - min(var(--comp-30), 30px));}
#secondContent h3:has( > span.ez-toc-section):first-child{ margin-top: 0;}
#secondContent h2 strong{ font-weight: 500; }
#secondContent h3 strong{ font-weight: 600; }
#secondContent h4 strong{ font-weight: 500; }
#secondContent h5 strong{ font-weight: 600; }
#secondContent .wp-block-heading .has-small-font-size{ display: inline-block; background-color: var(--blue); color: #fff; padding: min(var(--comp-15), 10px) min(var(--comp-30), 20px); font-size: 0.7647em !important; line-height: 1; margin-bottom: 1em;}

/*-- text --*/
#secondContent p{ font-size: min(var(--comp-26), 16px); line-height: 2.1875; color: var(--base-font-color); margin: 2.1875em auto;}
#secondContent h4 + p,
#secondContent h5 + p,
#secondContent h6 + p{ margin-top: 0;}
#secondContent p strong{ font-weight: bold;}
#secondContent p a{ color: #0063BE; text-decoration: underline;}
#secondContent .has-black-color{ color:var(--base-font-color);}
#secondContent .has-vivid-red-color{ color:var(--vividred);}
#secondContent p.has-text-align-right{ text-align: right;}
#secondContent p.has-text-align-center{ text-align: center;}
#secondContent p.has-small-font-size{ font-size: min(var(--comp-22), 14px) !important; line-height: 1.8 !important;}
#secondContent p:empty{ margin-bottom: min(var(--comp-110), 110px); }
#secondContent p.arrowLink.left{ text-align: left;}
#secondContent p.arrowLink.right{ text-align: right;}
#secondContent p.arrowLink a{ color: var(--base-font-color); text-decoration: none;}
#secondContent p.arrowLink.left a::after{ content: ""; display: inline-block; vertical-align: middle; width: min(var(--comp-25), 18px); height: min(var(--comp-25), 18px); background-image: url(../img/common/arrow-l-bk.svg); background-size: contain; background-position: 0 center;  background-repeat: no-repeat; margin-right: min(var(--comp-20), 15px);}

#secondContent p.arrowLink.right a::after{ content: ""; display: inline-block; vertical-align: middle; width: min(var(--comp-25), 18px); height: min(var(--comp-25), 18px); background-image: url(../img/common/arrow-r-bk.svg); background-size: contain; background-position: 0 center; background-repeat: no-repeat; margin-left: min(var(--comp-20), 15px);}

@media (any-hover: hover) {
#secondContent p.arrowLink a:hover{ opacity: 1;}
#secondContent p.arrowLink.left a:hover::before{ animation: pagerarrow 0.5s ease forwards;}
#secondContent p.arrowLink.right a:hover::after{ animation: pagerarrow-re 0.5s ease forwards;}
}

/*-- table --*/
#secondContent table{ background-color: var(--lightgray); padding: min(var(--comp-55), 35px) min(var(--comp-40), 40px); width: 100% !important; line-height: 2.1875; font-size: min(var(--comp-24), 16px); margin: min(var(--comp-70), 50px) auto;}
#secondContent table tr td,
#secondContent table tr th{ padding: min(var(--comp-15), 15px) min(var(--comp-15), 15px); border: 1px solid var(--gray); font-feature-settings: "palt"; letter-spacing: 0.05em;}
#secondContent table tr td p,
#secondContent table tr th p{ width: auto !important; max-width: 100% !important;}
#secondContent table tr td p:empty{ margin-bottom: 2.1875em;}
#secondContent table tr th{ font-weight: bold;}
#secondContent table tr:only-child td:only-child{ padding: min(var(--comp-55), 35px) min(var(--comp-40), 40px); border: none;}
#secondContent table table tr:only-child td:only-child{ border: 1px solid var(--gray);}
#secondContent table a{ color: #0063BE; text-decoration: underline;}
#secondContent .wp-block-table > table{ margin: 0;}

/*-- float --*/
#secondContent .wp-block-image .alignright { float: right; margin: 0 0 min(var(--comp-60), 60px) min(var(--comp-60), 60px); width: min(calc(50% - min(var(--comp-30), 30px)), 420px);}
#secondContent .wp-block-image .alignright img{ height: auto !important;}
#secondContent .wp-block-image .alignleft { float: left; margin: 0 min(var(--comp-60), 60px) min(var(--comp-60), 60px) 0; width: min(calc(50% - min(var(--comp-30), 30px)), 420px);}
#secondContent .wp-block-image .alignleft img{ height: auto !important;}
#secondContent .wp-block-image:has( > .alignright) + h3,
#secondContent .wp-block-image:has( > .alignright) + p{ overflow: hidden; width: auto;}
#secondContent .wp-block-image:has( + h3 > span.ez-toc-section){ margin-top: calc(min(var(--comp-120), 120px) - min(var(--comp-30), 30px));}
#secondContent .wp-block-image:has( > .alignright) + p{ margin-top: 0;}

/*-- flex --*/
#secondContent .is-layout-flex{ display: flex; flex-wrap: nowrap; gap: min(var(--comp-40), 40px); }
#secondContent .is-layout-flex img{ display: block;}

/*-- hr --*/
#secondContent .wp-block-separator{ border-top: 1px solid var(--gray); margin-left: auto; margin-right: auto;}
#secondContent .wp-block-separator:not(:last-child){ margin-bottom: min(var(--comp-60), 30px);}
#secondContent .wp-block-separator:not(:first-child){ margin-top: min(var(--comp-60), 30px);}
#secondContent .wp-block-separator + *{ margin-top: 0 ;}
#secondContent *:has( + .wp-block-separator){ margin-bottom: 0 ;}

/*-- list --*/
#secondContent .wp-block-list{ font-size: min(var(--comp-26), 16px); line-height: 2.1875; color: var(--base-font-color); margin: 2.1875em auto; }
#secondContent .wp-block-list li{ text-indent: -1.5em; padding-left: 1.5em;}
#secondContent .wp-block-list li::before{ content: "■"; color: var(--blue); margin-right: 0.5em;}
#secondContent .wp-block-list.grayList li::before{ color: #D1D7DD;}
#secondContent .wp-block-list a{ color: #0063BE; text-decoration: underline;}
#secondContent ol.wp-block-list{ list-style: decimal; padding-left: 1.5em; box-sizing: border-box; }
#secondContent ol.wp-block-list li{ text-indent: 0; padding-left: 0;}
#secondContent ol.wp-block-list li::before{ content: none; }
#secondContent ol.wp-block-list.has-background{ padding-left: calc(1.5em + min(var(--comp-40), 40px));}
#secondContent .wp-block-list.checkList{ font-size: min(var(--comp-26), 18px); line-height: 1.73;}
#secondContent .wp-block-list.checkList li{ text-indent: calc((min(var(--comp-39), 26px) + 0.8em) * (-1)); padding-left: calc(min(var(--comp-39), 26px) + 0.8em);}
#secondContent .wp-block-list.checkList li:not(:last-child){ margin-bottom: min(var(--comp-50), 30px);}
#secondContent .wp-block-list.checkList li::before{ content: ""; background-image: url(../img/common/icon-check.svg); background-repeat: no-repeat; background-position: center center; background-size: contain; aspect-ratio: 26 / 22; width: min(var(--comp-39), 26px); display: inline-block; vertical-align:text-bottom; margin-right: 0.8em;}
#secondContent .wp-block-list.simpleList01{ font-size: min(var(--comp-26), 16px); line-height: 2.1875; color: var(--base-font-color); margin: 2.1875em auto; }
#secondContent .wp-block-list.simpleList01 li{ text-indent: -1em; padding-left: 1em;}
#secondContent .wp-block-list.simpleList01 li::before{ content: "・"; color: var(--base-font-color); margin-right: 0;}
#secondContent .wp-block-list.textLinkList01{ font-size: min(var(--comp-26), 18px); }
#secondContent .term-description + .wp-block-list.textLinkList01{ margin-top: min(var(--comp-80), 60px);}
#secondContent .wp-block-list.textLinkList01 li{ border-bottom: 1px solid var(--gray); text-indent: 0; padding-left: 0; }
#secondContent .wp-block-list.textLinkList01 li:not(:last-child){ margin-bottom: min(var(--comp-25), 25px);}
#secondContent .wp-block-list.textLinkList01 li::before{ content: none;}
#secondContent .wp-block-list.textLinkList01 li a{ display: block; line-height: 1.9; padding-bottom: min(var(--comp-25), 25px); position: relative;}
#secondContent .wp-block-list.textLinkList01 li a::before{ content: ""; display: block; height: 1px; position: absolute; bottom: -1px; left: 0; transform: scaleX(0); transform-origin: top right; transition: transform 0.7s ease; background-color: var(--navy); width: 100%; height: 1px;}
#secondContent .wp-block-list.split2List{ font-size: min(var(--comp-25), 17px); column-gap: min(var(--comp-20), 20px); display: flex; flex-wrap: wrap;}
#secondContent .wp-block-list.split2List li{ width: calc((100% - min(var(--comp-20), 20px) - 1px) / 2); box-sizing: border-box; letter-spacing: 0; font-weight: 500;}
#secondContent .linkListtype01,
#secondContent .linkListtype01 > .wp-block-group__inner-container{ display: flex; gap: min(var(--comp-80), 60px); flex-wrap: wrap; margin: min(var(--comp-120), 120px) auto;}
#secondContent .linkListtype01:has( > .wp-block-group__inner-container){ display: block; margin-top: 0;}
#secondContent .wp-block-heading + .linkListtype01,
#secondContent .wp-block-heading + .linkListtype01:has( > .wp-block-group__inner-container) > .wp-block-group__inner-container{ margin-top: 0;}
#secondContent .linkListtype01 li,
#secondContent .linkListtype01 > .wp-block-group__inner-container > .wp-block-group{ width: calc((100% - min(var(--comp-80), 60px) - 1px) / 2); position: relative;}
#secondContent .linkListtype01 figure{ display: block; transition: all ease 0.5s; overflow: hidden;}
#secondContent .linkListtype01 figure img{ transition: all 0.5s ease;}
#secondContent .linkListtype01 .ttl{ font-size: min(var(--comp-34), 22px); line-height: 1.8; font-weight: 500; margin: min(var(--comp-35), 35px) auto min(var(--comp-30), 30px);}
#secondContent .linkListtype01 .ttl a{ text-decoration: underline; color: var(--blue);}
#secondContent .linkListtype01 .ttl a::before{ content: ""; display: block; position: absolute; top: 0; left: 0; width: 100%; aspect-ratio: 84 / 42;}
#secondContent .linkListtype01 .text{ margin: 0 auto;}
#secondContent .linkListtype02,
#secondContent .linkListtype02 > .wp-block-group__inner-container{ display: flex; gap: min(var(--comp-75), 60px); flex-wrap: wrap; margin: min(var(--comp-75), 60px) auto;}
#secondContent .linkListtype02:has( > .wp-block-group__inner-container){ display: block;}
#secondContent .linkListtype02 li,
#secondContent .linkListtype02 .innerLinkListtype02 > .wp-block-group__inner-container{ width: 100%; border-bottom: 1px solid var(--gray); display: flex; position: relative; gap: min(var(--comp-35), 40px); justify-content: space-between; padding-bottom: min(var(--comp-75), 60px); align-items: flex-start;}
#secondContent .linkListtype02 figure{ width: min(33.33333%, 300px); overflow: hidden; display: block; aspect-ratio: 600 / 420;}
#secondContent .linkListtype02 figure img{ transition: all 0.5s ease; object-fit: cover; width: 100%; height: 100%;}
#secondContent .linkListtype02 .textBox{ width: calc(100% - min(33.33333%, 300px) - min(var(--comp-35), 40px));}
#secondContent .linkListtype02 .ttl{ color: var(--blue); font-size: min(var(--comp-34), 22px); line-height: 1.8; font-weight: 500; margin: 0 auto min(var(--comp-30), 30px);}
#secondContent .linkListtype02 .ttl a{ text-decoration: none; color: var(--blue);}
#secondContent .linkListtype02 .ttl a::before{ content: ""; display: block; position: absolute; top: 0; left: 0; aspect-ratio: 60 / 42; width: min(33.33333%, 300px);}
#secondContent .linkListtype02 .text{ margin: 0 auto; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 3; overflow: hidden;}
#secondContent .textDataList01{ display: flex; flex-wrap: wrap; gap: min(var(--comp-50), 50px); margin: 0 auto;}
#secondContent .textDataList01 > .wp-block-group__inner-container{ display: contents;}
#secondContent .textDataList01 .wp-block-group__inner-container .innertextDataList01{ border-bottom: 1px solid var(--gray); padding-bottom: min(var(--comp-50), 50px);}
#secondContent .textDataList01 .wp-block-group__inner-container .innertextDataList01 .date{ font-size: min(var(--comp-26), 16px); color: var(--darkgray); margin: 0 auto min(var(--comp-30), 20px); line-height: 1;}
#secondContent .textDataList01 .wp-block-group__inner-container .innertextDataList01 .ttl{ color: var(--blue); font-size: min(var(--comp-34), 22px); line-height: 1.8; font-weight: 500; margin: 0 auto min(var(--comp-20), 20px); font-feature-settings: "palt"; letter-spacing: 0.08em;}
#secondContent .textDataList01 .wp-block-group__inner-container .innertextDataList01 .text{ margin: 0 auto; letter-spacing: 0.02em;}
#secondContent .textDataList02{ margin: 0 auto;}
#secondContent .textDataList02 > .wp-block-group__inner-container{ display: contents;}
#secondContent .textDataList02 .wp-block-group__inner-container .innertextDataList02{ display: flex; justify-content: space-between; border-bottom: 1px solid var(--gray); padding-bottom: min(var(--comp-30), 30px); font-size: min(var(--comp-26), 16px);}
#secondContent .textDataList02 .wp-block-group__inner-container .innertextDataList02:not(:last-child){ margin-bottom: min(var(--comp-30), 30px);}
#secondContent .textDataList02 .wp-block-group__inner-container .innertextDataList02 > .wp-block-group__inner-container{ display: contents;}
#secondContent .textDataList02 .wp-block-group__inner-container .innertextDataList02 .date{ font-size: min(var(--comp-26), 16px); color: var(--darkgray); width: min(15em, 150px); margin: 0;}
#secondContent .textDataList02 .wp-block-group__inner-container .innertextDataList02 .wp-block-list.simpleList01{ width: calc(100% - min(15em, 150px) - 1px) !important; margin: 0;}
#secondContent .mediaDataList01{ margin: 0 auto;}
#secondContent .mediaDataList01 .wp-block-group__inner-container{ display: contents;}
#secondContent .mediaDataList01 .innerMediaDataList01{ display: flex; gap: min(var(--comp-35), 40px); flex-wrap: wrap; padding-bottom: min(var(--comp-80), 60px); border-bottom: 1px solid var(--gray);}
#secondContent .mediaDataList01 .innerMediaDataList01:not(:last-child){ margin-bottom: min(var(--comp-80), 60px);}
#secondContent .mediaDataList01 .innerMediaDataList01 > .wp-block-group__inner-container > figure{ width: min(33.33333%, 300px);}
#secondContent .mediaDataList01 .innerMediaDataList01 .textBox{ width: calc(100% - min(33.33333%, 300px) - min(var(--comp-35), 40px) - 1px);}
#secondContent .mediaDataList01 .innerMediaDataList01 .textBox .ttl{ color: var(--blue); font-size: min(var(--comp-34), 22px); line-height: 1.8; font-weight: 500; margin: 0 auto min(var(--comp-20), 20px); font-feature-settings: "palt"; letter-spacing: 0.08em;}
#secondContent .mediaDataList01 .innerMediaDataList01 .textBox .wp-block-list{ margin: 0 auto 2.1875em;}
#secondContent .mediaDataList01 .innerMediaDataList01 .textBox p:has( + .is-layout-flex > .wp-block-button){ margin-bottom: 0;}
#secondContent .mediaDataList01 .innerMediaDataList01 .textBox .is-layout-flex:has(.wp-block-button){ margin: min(var(--comp-40), 40px) 0 0; flex-wrap: wrap;}
#secondContent .mediaDataList01 .innerMediaDataList01 .textBox .is-layout-flex .wp-block-button{ width: min(var(--comp-500), 240px);}
#secondContent .mediaDataList01 .innerMediaDataList01 .textBox .is-layout-flex .wp-block-button a{ padding: min(var(--comp-30), 20px) min(var(--comp-45), 40px) min(var(--comp-30), 20px) min(var(--comp-40), 25px);}
#secondContent .mediaDataList01 .innerMediaDataList01 .textBox .is-layout-flex .wp-block-button a::after{ right: min(var(--comp-40), 25px);}

/*-- link --*/
#secondContent .wp-block-image.linkBtnType01{ max-width: 400px; margin-top: min(var(--comp-120), 120px); margin-left: auto; margin-right: auto;}

@media (any-hover: hover) {
#secondContent .wp-block-list.textLinkList01 a:hover{ opacity: 1;}
#secondContent .wp-block-list.textLinkList01 a:hover::before{ transform: scaleX(100%); transform-origin: top left;}
#secondContent .linkListtype01 figure:has(  + .ttl > a:hover) img{ transform: scale(1.05);}
#secondContent .linkListtype02 figure:has( + .textBox .ttl > a:hover) img{ transform: scale(1.05);}
}

/*-- button --*/
/*action-buttons*/
#secondContent .action-buttons{ margin-left: calc(270px + min(var(--comp-30), 30px));}
#secondContent .action-buttons:has(.previousBtn):has(.submitBtn){ display: flex; flex-wrap: wrap; justify-content: start; gap: min(var(--comp-10), 40px); position: relative;}
#secondContent .action-buttons .previousBtn input,
#secondContent .action-buttons .submitBtn input{ width:100%; background-color: var(--navy); font-family: var(--base-font); font-size: min(var(--comp-26), 18px); box-sizing: border-box; padding: min(var(--comp-20), 8px) min(var(--comp-45), 30px) min(var(--comp-20), 12px); color: #fff;}
#secondContent .action-buttons .previousBtn p,
#secondContent .action-buttons .submitBtn p{ width:100%;}
#secondContent .action-buttons .previousBtn{ width: min(var(--comp-280), 200px); text-align: right; position: relative; overflow: hidden;}
#secondContent .action-buttons .previousBtn::after{ content: ""; position: absolute; top: 50%; left: min(var(--comp-45), 30px); width: min(var(--comp-20), 15px); height: min(var(--comp-15), 10px);  background-image: url(../img/common/arrow-l.svg); background-size: contain; background-repeat: no-repeat; background-position: 0% center; transform: translateY(-50%); transition: background-position 0.3s ease; pointer-events: none;}
#secondContent .action-buttons .submitBtn { width: min(var(--comp-280), 200px); position: relative; overflow: hidden;}
#secondContent .action-buttons .submitBtn::after{ content: ""; position: absolute; top: 50%; right: min(var(--comp-45), 30px); width: min(var(--comp-20), 15px); height: min(var(--comp-15), 10px); background-image: url(../img/common/arrow-l.svg); background-size: contain; background-repeat: no-repeat; background-position: 0% center; transform: translateY(-50%) rotate(180deg); transition: background-position 0.3s ease; pointer-events: none;}

/* wp-block-buttons */
#secondContent .is-layout-flex.wp-block-buttons{ gap: min(var(--comp-20), 20px); margin-top: min(var(--comp-110), 110px);}
#secondContent .is-layout-flex.wp-block-buttons > .wp-block-button{ min-width: min(var(--comp-500), 320px);}
#secondContent .is-layout-flex.wp-block-buttons.wide > .wp-block-button{ width: min(var(--comp-500), 400px);}
#secondContent .is-layout-flex.wp-block-buttons.center{ justify-content: center;}
#secondContent .wp-block-buttons .is-layout-flex{ display: flex; flex-wrap: wrap; justify-content: start; gap: min(var(--comp-10), 40px); position: relative;}
#secondContent .wp-block-buttons .wp-block-button{ min-width: min(var(--comp-500), 320px); max-width: 100%; position: relative; overflow: hidden;}
#secondContent .wp-block-buttons .wp-block-button a{ width:100%; background-color: var(--navy); font-family: var(--base-font); font-size: min(var(--comp-26), 18px); box-sizing: border-box; padding: min(var(--comp-40), 25px) min(var(--comp-70), 60px) min(var(--comp-45), 30px) min(var(--comp-45), 30px); color: #fff; display: block; box-sizing: border-box; border-radius: 0; text-align: left; line-height: 1.6;}
#secondContent .wp-block-buttons .wp-block-button a::after{ content: ""; position: absolute; top: calc(50% - (min(var(--comp-15), 10px)/2)); right: min(var(--comp-45), 30px); width: min(var(--comp-20), 15px); height: min(var(--comp-15), 10px); background-image: url(../img/common/arrow-l.svg); background-size: contain; background-repeat: no-repeat; background-position: 0% center; transform: translateY(-50%) translateX(0%); transition: background-position 0.3s ease; pointer-events: none; transform: rotate(180deg);}

/*snow monkey*/
/* button */
#secondContent .smb-box{ padding: min(var(--comp-70), 50px) min(var(--comp-70), 60px);; margin: min(var(--comp-70), 50px) auto;;}
#secondContent .smb-box__background{ background-color: var(--lightgray); background: var(--lightgray) !important; box-sizing: border-box; border: none;}

/* smb-btn-box__btn-wrapper */
:root :where(p.is-style-sme-post-it-narrow):after{ background-color: var(--blue); }
#secondContent p.is-style-sme-post-it-narrow{ box-shadow: none; border: 1px solid var(--gray);}
#secondContent .smb-btn-box{ width: 100%; padding: min(var(--comp-70), 50px) min(var(--comp-50), 50px); background: var(--lightgray); box-sizing: border-box; margin: min(var(--comp-60), 60px) auto;}
#secondContent .smb-btn-box .c-container{ padding: 0;}
#secondContent .smb-btn-box:not(:last-child){ margin: 0 auto min(var(--comp-80), 60px);}
#secondContent .smb-btn-box .smb-btn-box__lede{ font-size: min(var(--comp-24), 18px); text-align: center; margin: 0 auto min(var(--comp-30), 30px); line-height:1.8; font-family: var(--base-font);}
#secondContent .smb-btn-box__btn-wrapper{ width: 100%; position: relative; overflow: hidden; margin: 0 auto; text-align: center;}
#secondContent .smb-btn-box__btn-wrapper a{ width: auto; min-width: min(var(--comp-500), 360px); max-width: 100%; display: inline-block; background-color: var(--navy); font-family: var(--base-font); font-size: min(var(--comp-26), 18px); box-sizing: border-box; padding: min(var(--comp-45), 30px) min(var(--comp-80), 70px) min(var(--comp-45), 30px) min(var(--comp-45), 30px); color: #fff; position: relative; text-align: left; border-radius: 0 !important; line-height: 1.6;}
#secondContent .smb-btn-box__btn-wrapper a::after{ content: ""; position: absolute; top: calc(50% - (min(var(--comp-15), 10px)/2)); right: min(var(--comp-45), 30px); width: min(var(--comp-20), 15px); height: min(var(--comp-15), 10px); background-image: url(../img/common/arrow-l.svg); background-size: contain; background-repeat: no-repeat; background-position: 0% center; transform: translateY(-50%) translateX(0%); transition: background-position 0.3s ease; pointer-events: none; transform: rotate(180deg);}
#secondContent .smb-btn-box__btn-wrapper a .smb-btn__label{ white-space: wrap;}

@media (any-hover: hover) {
#secondContent .wp-block-buttons .wp-block-button a:hover,
#secondContent .smb-btn-box__btn-wrapper a:hover{ opacity: 1;}
#secondContent .action-buttons .previousBtn:hover::after,
#secondContent .action-buttons .submitBtn:hover::after,
#secondContent .wp-block-buttons .wp-block-button a:hover::after,
#secondContent .smb-btn-box__btn-wrapper a:hover::after{ animation: slideOutInCF-re 0.5s ease; }
}

@media screen and (width <= 800px){
#secondContent .action-buttons{ margin: 0;}
#secondContent .action-buttons:has(.previousBtn):has(.submitBtn){ margin: 0 auto; justify-content: space-between;}
#secondContent .action-buttons:has(.previousBtn):has(.submitBtn) .previousBtn,
#secondContent .action-buttons:has(.previousBtn):has(.submitBtn) .submitBtn{ width: calc(50% - min(var(--comp-10), 40px));}
}
@media screen and (width <= 980px){
#secondContent .action-buttons{ margin: 0;}
#secondContent .action-buttons:has(.previousBtn):has(.submitBtn){ margin: 0 auto;}
}

@media screen and (1280px < width <= 1390px){
#secondContent .action-buttons:has(.previousBtn):has(.submitBtn){ display: block;}
#secondContent .action-buttons:has(.previousBtn):has(.submitBtn) .previousBtn{ margin-bottom: min(var(--comp-10), 40px);}
}

@media screen and (width <= 800px){
#secondContent .scrollable{ overflow: scroll !important;}
#secondContent .scrollable:not(:has( > .wp-block-group__inner-container)) > *:not(.scroll-hint-icon-wrap),
#secondContent .scrollable:has( > .wp-block-group__inner-container) > .wp-block-group__inner-container > *:not(.scroll-hint-icon-wrap){ width: 900px;}
}

/*-- contact-form --*/
#secondContent .contact-form{ margin-top: min(var(--comp-110), 120px);}
#secondContent .contact-form p:has(+ dl){ margin-bottom: min(var(--comp-110), 120px);}
#secondContent .contact-form dl{ display: flex; flex-wrap: wrap; align-items: center; gap: min(var(--comp-30), 30px); margin: 0 auto min(var(--comp-60), 30px);}
#secondContent .contact-form dl:last-child{ margin-bottom: min(var(--comp-80), 60px);}
#secondContent .contact-form dl dt{ width: min(100%, 270px);}
#secondContent .contact-form dl dt,
#secondContent .contact-form dl dt > p{ display: flex; justify-content: space-between; align-items: center; font-size: min(var(--comp-26), 18px); font-weight: 500;}
#secondContent .contact-form dl dt:has( > p){ display: block;}
#secondContent .contact-form dl dt .require{ display: inline-block; background-color: var(--blue); color: #fff; font-weight: 500; box-sizing: border-box; font-size: min(var(--comp-22), 14px); line-height: 1; width: min(var(--comp-100), 60px); height: min(var(--comp-40), 24px); padding: min(var(--comp-10), 4px) 0 0; text-align: center;}
#secondContent .contact-form dl dd{ background-color: var(--lightgray); width: calc(100% - 270px - min(var(--comp-30), 30px));}
#secondContent .contact-form.kakunin dl dd > p{ padding: min(var(--comp-22), 22px) min(var(--comp-40), 30px); outline: 0; width: 100%; max-width: 100%; min-width: 100%; box-sizing: border-box; min-height: min(var(--comp-105), 80px); margin: 0;}
#secondContent .contact-form select { appearance: none; background-image: url("../img/common/arrow-b-b.svg"); background-repeat: no-repeat; background-position: right min(var(--comp-40), 30px) center; background-size: min(var(--comp-15), 10px); box-sizing: border-box;}
#secondContent .contact-form .wpcf7-not-valid-tip{ padding: 0 min(var(--comp-40), 30px) min(var(--comp-22), 22px); font-size: min(var(--comp-22), 14px); margin-top: min(var(--comp-20), 15px); width: 100%; box-sizing: border-box;}

#secondContent .contact-form select[name="contact-type"],
#secondContent .contact-form select[name="post"],
#secondContent .contact-form input[type="text"],
#secondContent .contact-form input[type="tel"],
#secondContent .contact-form input[type="password"],
#secondContent .contact-form input[type="number"],
#secondContent .contact-form input[type="email"],
#secondContent .contact-form input[type="url"],
#secondContent .contact-form .wpcf7-checkbox,
#secondContent .contact-form textarea { padding: min(var(--comp-22), 22px) min(var(--comp-40), 30px); outline: 0; width: 100%; max-width: 100%; min-width: 100%; box-sizing: border-box; min-height: min(var(--comp-105), 80px);}

#secondContent .contact-form input{ font-size: 16px !important;}

#secondContent .contact-form input[type="text"]:focus,
#secondContent .contact-form input[type="tel"]:focus,
#secondContent .contact-form input[type="password"]:focus,
#secondContent .contact-form input[type="password"]:focus,
#secondContent .contact-form input[type="number"]:focus,
#secondContent .contact-form input[type="email"]:focus,
#secondContent .contact-form input[type="url"]:focus,
:focus-visible,
#secondContent .contact-form textarea:focus{ outline: 1px solid var(--base-font-color);}
#secondContent .contact-form input[type="radio"] { -webkit-appearance: radio; appearance: radio;}
#secondContent .contact-form input[type="radio"] { opacity: 0; visibility: hidden; position: absolute;}
#secondContent .contact-form .wpcf7-radio{ display: flex; flex-wrap: nowrap; align-items: center; column-gap: min(var(--comp-40), 30px); width: 100%; padding: min(var(--comp-22), 22px) min(var(--comp-40), 30px) 0; box-sizing: border-box; flex-wrap: wrap;}
#secondContent .contact-form .wpcf7-radio .wpcf7-list-item{ margin-left: 0;}
#secondContent .contact-form .wpcf7-radio span.wpcf7-list-item-label { position: relative; display: flex; align-items: center; cursor: pointer;}
#secondContent .contact-form .wpcf7-radio span.wpcf7-list-item-label::before { display: block; content: "";
  border-radius: 50%; border: 1px solid var(--base-font-color); background: #fff; width: min(var(--comp-30), 20px); height: min(var(--comp-30), 20px); margin-right: min(var(--comp-15), 15px); box-sizing: border-box;}
#secondContent .contact-form .wpcf7-radio span.wpcf7-list-item-label::after { display: block; position: absolute; content: ""; border-radius: 50%; width: min(var(--comp-15), 10px); height: min(var(--comp-15), 10px); background-color: var(--base-font-color); left: calc(min(var(--comp-15), 10px) / 2); top: 50%; transform: translateY(-50%); display: none; box-sizing: border-box;}
#secondContent .contact-form input[type="radio"]:checked + span.wpcf7-list-item-label::after { display: block;}
#secondContent p:has(.wpcf7-radio){ margin-bottom: 0;}
#secondContent .contact-form .notes p{ font-size: min(var(--comp-22), 14px); color: var(--darkgray); margin-top: min(var(--comp-20), 15px); width: 100%; box-sizing: border-box; padding: 0 min(var(--comp-40), 30px) min(var(--comp-22), 22px);}
.wpcf7-spinner{ display: none; }

/*-- magazine --*/
#secondContent .is-layout-flex:has(.wp-block-button){ margin: min(var(--comp-80), 60px) auto 0;}
#secondContent .contact-form:has(.placeholderTxt) dl dd { position: relative;}
#secondContent .contact-form:has(.placeholderTxt) .placeholderTxt{ position: absolute; top: calc(50% - (min(var(--comp-22), 22px)/2)); left:  min(var(--comp-40), 30px); font-size: min(var(--comp-18), 16px); color: var(--darkgray); font-family: var(--base-font); pointer-events: none; transition: 0.3s ease;}
#secondContent .contact-form:has(.placeholderTxt) dl dd:has(input:focus) .placeholderTxt { opacity: 0; transition: 0.3s;}
#secondContent .contact-form input::placeholder { font-size: min(var(--comp-20), 16px); color: var(--darkgray); font-feature-settings: "palt"}
#secondContent .contact-form dl.ddText { margin: min(var(--comp-70), 50px) auto;}
#secondContent .contact-form dl.ddText dd { background-color: #FFF; width: calc(100% - 270px - min(var(--comp-30), 30px)); margin-left: calc(270px + min(var(--comp-30), 30px)); margin-bottom: 0;}

/*-- doc_dl --*/
#secondContent .has-background{ width: 100%; margin: min(var(--comp-70), 50px) auto; padding: min(var(--comp-70), 50px) min(var(--comp-50), 50px); background: var(--lightgray) !important; box-sizing: border-box;}
#secondContent .contact-form .wpcf7-checkbox{ display: block; padding: min(var(--comp-22), 22px) min(var(--comp-40), 30px) 0; outline: 0; width: 100%; max-width: 100%; min-width: 100%; box-sizing: border-box; min-height: min(var(--comp-105), 80px);}
#secondContent .contact-form .wpcf7-checkbox .wpcf7-list-item label{ display: flex; flex-wrap: nowrap; align-items: center; }
#secondContent .contact-form .wpcf7-checkbox .wpcf7-list-item{ margin-left: 0; width: 100%;}
#secondContent .contact-form .wpcf7-checkbox .wpcf7-list-item:not(:last-child){ margin-bottom :0;}
#secondContent .contact-form input[type="checkbox"] { position: relative; width: min(var(--comp-20), 20px); height: min(var(--comp-20), 20px); box-sizing: border-box; border: 1px solid #000; background: #FFF; margin-right: min(var(--comp-15), 15px);}
#secondContent .contact-form input[type="checkbox"]:checked:before { position: absolute; top: 50%; left: 50%; transform: rotate(50deg) translate(-121%, -20%); width: 33%; height: 60%; border-right: 1px solid #000; border-bottom: 1px solid var(--base-font-color); content: '';}

/*-- shiryo_dl --*/
#secondContent .post-password-form p:has(input[type="password"]){ width: 100%; box-sizing: border-box; display: flex; flex-wrap: nowrap; justify-content: start; gap: min(var(--comp-20), 20px); font-size: min(var(--comp-26), 16px);}
#secondContent .post-password-form p:has(input[type="password"]) label{ display: flex; flex-wrap: nowrap; justify-content: start; gap: min(var(--comp-20), 20px);}
#secondContent .post-password-form input[type="password"]{ background-color: var(--lightgray); width: min(var(--comp-200), 200px); min-height: min(var(--comp-70), 40px); padding: 0 min(var(--comp-20), 15px);  box-sizing: border-box;}
#secondContent .post-password-form input[type="submit"]{ min-width: min(var(--comp-70), 100px); min-height:(var(--comp-70), 40px); background-color: var(--navy); font-family: var(--base-font); font-size: min(var(--comp-26), 18px); box-sizing: border-box; padding: 0 min(var(--comp-40), 30px) ; color: #fff; text-align: center; transition: all ease 0.6s;}
#secondContent .post-password-form input[type="submit"]:hover{ opacity: 0.7;}

/*-- roumuouen-konsaru --*/
:root{
  --phasewidth1: 17.2972972972972972972%;
  --phasewidth2: 37.2972972972972972972%;
  --phasewidth3: 57.2972972972972972972%;
  --phasewidth4: 77.2972972972972972972%;
  --phasewidth5: 97.2972972972972972972%;
}

#secondContent .roumuouen_consaruTopBox,
#secondContent .roumuouen_consaruTopBox > .wp-block-group__inner-container { display: flex; flex-direction: row-reverse; flex-wrap: wrap; justify-content: space-between; width: 100%; align-items: stretch;}
#secondContent .roumuouen_consaruTopBox:has(> .wp-block-group__inner-container) { display: block;}
#secondContent .roumuouen_consaruTopBox .wp-block-image{ width: min(55.555555%, 500px);}
#secondContent .roumuouen_consaruTopBox .roumuouen_consaruTopTextBox,
#secondContent .roumuouen_consaruTopBox .roumuouen_consaruTopTextBox > .wp-block-group__inner-container{ width: min(40%, 340px); display: flex; flex-direction: column; justify-content: space-between; height: auto; }
#secondContent .roumuouen_consaruTopBox .roumuouen_consaruTopTextBox:has( > .wp-block-group__inner-container) .wp-block-group__inner-container{ width: 100%; flex: 1;}
#secondContent .roumuouen_consaruTopBox .roumuouen_consaruTopTextBox .smb-btn-box__btn-wrapper,
#secondContent .roumuouen_consaruTopBox .roumuouen_consaruTopTextBox .wp-block-buttons{ width: calc(100% - min(var(--comp-20), 20px)); margin-left: 0; margin-top: 0;}

#secondContent .phaseBox{ width: min(100%, 740px); margin: 0 auto;}
#secondContent .phaseBox .phaseHead{ margin: 0; width: 100%; aspect-ratio: 740 / 180; background-image: url(../img/roumuouen-konsaru/ttl-phase.svg); background-size: 100%; background-repeat: no-repeat; background-position: center center;}
#secondContent .phaseBox .phaseHead .text{ display: none;}
#secondContent .phaseBox .innerPhaseBox{ width: 100%; aspect-ratio: 740 / 1520; background-image: url(../img/roumuouen-konsaru/bg-phase.svg); background-repeat: repeat-y; background-position: center top; background-size: 100%; position: relative;}
#secondContent .phaseBox .innerPhaseBox .phaseBtn{ position: absolute; margin: 0; font-size: 0px; display: block;}
#secondContent .phaseBox .innerPhaseBox .phaseBtn a{ display: block; width: 100%; height: 100%; display: block;}
#secondContent .phaseBox .innerPhaseBox .phaseBtn.phase01{ background-image: url(../img/roumuouen-konsaru/phase01-off.svg); aspect-ratio: 128 / 180; top: 1.3157894%; left: 41.35135135135135135%; width: var(--phasewidth1);}
#secondContent .phaseBox .innerPhaseBox .phaseBtn.phase01 a{ background-image: url(../img/roumuouen-konsaru/btn-phase01-on.svg);}
#secondContent .phaseBox .innerPhaseBox .phaseBtn.phase02{ background-image: url(../img/roumuouen-konsaru/phase02-off.svg); aspect-ratio: 276 / 80; top: 1.3157894%; right: 1.351351351351%; width: var(--phasewidth2);}
#secondContent .phaseBox .innerPhaseBox .phaseBtn.phase02 a{ background-image: url(../img/roumuouen-konsaru/btn-phase02-on.svg);}
#secondContent .phaseBox .innerPhaseBox .phaseBtn.phase03{ background-image: url(../img/roumuouen-konsaru/phase03-off.svg); aspect-ratio: 276 / 80; top: 7.8947368%; left: 1.351351351351%; width: var(--phasewidth2);}
#secondContent .phaseBox .innerPhaseBox .phaseBtn.phase03 a{ background-image: url(../img/roumuouen-konsaru/btn-phase03-on.svg);}
#secondContent .phaseBox .innerPhaseBox .phaseBtn.phase04{ background-image: url(../img/roumuouen-konsaru/phase04-off.svg); aspect-ratio: 128 / 80; top: 7.8947368%; right: 1.351351351351%; width: var(--phasewidth1);}
#secondContent .phaseBox .innerPhaseBox .phaseBtn.phase04 a{ background-image: url(../img/roumuouen-konsaru/btn-phase04-on.svg);}
#secondContent .phaseBox .innerPhaseBox .phaseBtn.phase05{ background-image: url(../img/roumuouen-konsaru/phase05-off.svg); aspect-ratio: 276 / 80; top: 14.4736842%; left: 1.351351351351%; width: var(--phasewidth2);}
#secondContent .phaseBox .innerPhaseBox .phaseBtn.phase05 a{ background-image: url(../img/roumuouen-konsaru/btn-phase05-on.svg);}
#secondContent .phaseBox .innerPhaseBox .phaseBtn.phase06{ background-image: url(../img/roumuouen-konsaru/phase06-off.svg); aspect-ratio: 424 / 80; top: 14.4736842%; right: 1.351351351351%; width: var(--phasewidth3);}
#secondContent .phaseBox .innerPhaseBox .phaseBtn.phase06 a{ background-image: url(../img/roumuouen-konsaru/btn-phase06-on.svg);}
#secondContent .phaseBox .innerPhaseBox .phaseBtn.phase07{ background-image: url(../img/roumuouen-konsaru/phase07-off.svg); aspect-ratio: 424 / 80; top: 21.0526315%; left: 21.351351351351%; width: var(--phasewidth3);}
#secondContent .phaseBox .innerPhaseBox .phaseBtn.phase07 a{ background-image: url(../img/roumuouen-konsaru/btn-phase07-on.svg);}
#secondContent .phaseBox .innerPhaseBox .phaseBtn.phase08{ background-image: url(../img/roumuouen-konsaru/phase08-off.svg); aspect-ratio: 424 / 80; top: 27.6315789%; right: 1.351351351351%; width: var(--phasewidth3);}
#secondContent .phaseBox .innerPhaseBox .phaseBtn.phase08 a{ background-image: url(../img/roumuouen-konsaru/btn-phase08-on.svg);}
#secondContent .phaseBox .innerPhaseBox .phaseBtn.phase09{ background-image: url(../img/roumuouen-konsaru/phase09-off.svg); aspect-ratio: 424 / 80; top: 34.2105263%; right: 1.351351351351%; width: var(--phasewidth3);}
#secondContent .phaseBox .innerPhaseBox .phaseBtn.phase09 a{ background-image: url(../img/roumuouen-konsaru/btn-phase09-on.svg);}
#secondContent .phaseBox .innerPhaseBox .phaseBtn.phase10{ background-image: url(../img/roumuouen-konsaru/phase10-off.svg); aspect-ratio: 424 / 80; top: 40.7894736%; right: 1.351351351351%; width: var(--phasewidth3);}
#secondContent .phaseBox .innerPhaseBox .phaseBtn.phase10 a{ background-image: url(../img/roumuouen-konsaru/btn-phase10-on.svg);}
#secondContent .phaseBox .innerPhaseBox .phaseBtn.phase11{ background-image: url(../img/roumuouen-konsaru/phase11-off.svg); aspect-ratio: 276 / 80; top: 47.368421%; right: 1.351351351351%; width: var(--phasewidth2);}
#secondContent .phaseBox .innerPhaseBox .phaseBtn.phase11 a{ background-image: url(../img/roumuouen-konsaru/btn-phase11-on.svg);}
#secondContent .phaseBox .innerPhaseBox .phaseBtn.phase12{ background-image: url(../img/roumuouen-konsaru/phase12-off.svg); aspect-ratio: 276 / 80; top: 53.9473684%; left: 21.351351351351%; width: var(--phasewidth2);}
#secondContent .phaseBox .innerPhaseBox .phaseBtn.phase12 a{ background-image: url(../img/roumuouen-konsaru/btn-phase12-on.svg);}
#secondContent .phaseBox .innerPhaseBox .phaseBtn.phase13{ background-image: url(../img/roumuouen-konsaru/phase13-off.svg); aspect-ratio: 572 / 80; top: 60.5263157%; right: 1.351351351351%; width: var(--phasewidth4);}
#secondContent .phaseBox .innerPhaseBox .phaseBtn.phase13 a{ background-image: url(../img/roumuouen-konsaru/btn-phase13-on.svg);}
#secondContent .phaseBox .innerPhaseBox .phaseBtn.phase14{ background-image: url(../img/roumuouen-konsaru/phase14-off.svg); aspect-ratio: 572 / 80; top: 67.1052631%; right: 1.351351351351%; width: var(--phasewidth4);}
#secondContent .phaseBox .innerPhaseBox .phaseBtn.phase14 a{ background-image: url(../img/roumuouen-konsaru/btn-phase14-on.svg);}
#secondContent .phaseBox .innerPhaseBox .phaseBtn.phase15{ background-image: url(../img/roumuouen-konsaru/phase15-off.svg); aspect-ratio: 572 / 80; top: 73.6842105%; right: 1.351351351351%; width: var(--phasewidth4);}
#secondContent .phaseBox .innerPhaseBox .phaseBtn.phase15 a{ background-image: url(../img/roumuouen-konsaru/btn-phase15-on.svg);}
#secondContent .phaseBox .innerPhaseBox .phaseBtn.phase16{ background-image: url(../img/roumuouen-konsaru/phase16-off.svg); aspect-ratio: 572 / 80; top: 80.2631578%; right: 1.351351351351%; width: var(--phasewidth4);}
#secondContent .phaseBox .innerPhaseBox .phaseBtn.phase16 a{ background-image: url(../img/roumuouen-konsaru/btn-phase16-on.svg);}
#secondContent .phaseBox .innerPhaseBox .phaseBtn.phase17{ background-image: url(../img/roumuouen-konsaru/phase17-off.svg); aspect-ratio: 720 / 80; top: 86.8421052%; right: 1.351351351351%; width: var(--phasewidth5);}
#secondContent .phaseBox .innerPhaseBox .phaseBtn.phase17 a{ background-image: url(../img/roumuouen-konsaru/btn-phase17-on.svg);}
#secondContent .phaseBox .innerPhaseBox .phaseBtn.phase18{ background-image: url(../img/roumuouen-konsaru/phase18-off.svg); aspect-ratio: 720 / 80; top: 93.4210526%; right: 1.351351351351%; width: var(--phasewidth5);}
#secondContent .phaseBox .innerPhaseBox .phaseBtn.phase18 a{ background-image: url(../img/roumuouen-konsaru/btn-phase18-on.svg);}
#secondContent .phaseBox .innerPhaseBox .phaseBtn,
#secondContent .phaseBox .innerPhaseBox .phaseBtn a{ background-repeat: no-repeat; background-position: center; background-size: 100%; }

@media screen and (width <= 980px){
	#secondContent .wpcf7,
  #secondContent .wrapcontent01,
  #secondContent .post-password-form{ margin: 0 auto;}
	#secondContent .contact-form dl{ display: block; margin: 0 auto var(--comp-60);}
	#secondContent .contact-form dl dt,
  #secondContent .contact-form dl dd{ width: 100%;}
	#secondContent .contact-form dl dt{ margin-bottom: var(--comp-20);}

  #secondContent .contact-form dl.ddText dd { background-color: #FFF; width: 100%; margin: 0 auto;}
}

@media screen and (1280px < width <= 1380px){
#secondContent .contact-form .wpcf7-radio{ row-gap: min(var(--comp-10), 15px);}
}

/*-- zenkoku_online --*/
#secondContent .smb-step { counter-reset: item;}
#secondContent .smb-step__body { position: relative; width: 100%; margin: 0 auto;}
#secondContent .smb-step__body:before { border-left: 1px solid var(--gray); position: absolute; top: min(var(--comp-25), 25px); left: min(var(--comp-25), 25px); bottom: min(var(--comp-45), 35px); content: ""; display: block; }
#secondContent .smb-step__item:not(:last-child){ padding: 0 0 min(var(--comp-70), 70px);}
#secondContent .smb-step__item__title { display: flex; flex-direction: row; flex-wrap: nowrap; align-items: center; padding-left: min(var(--comp-80), 100px); font-size: min(var(--comp-26), 18px); font-weight: 500; margin-bottom: min(var(--comp-25), 25px); position: relative; line-height: 1.8; font-family: var(--base-font); margin-left: 0;}
#secondContent .smb-step__item__title:has(+ .smb-step__item__body:has(p)){ margin-bottom: 0;}
#secondContent .smb-step__item__title>.smb-step__item__number { position: absolute; top: 50%; left: 0; transform: translateY(-50%); margin: 0;}
#secondContent .smb-step__item__title>span { flex: 1 1 auto ;}
#secondContent .smb-step__item__title a{ color: #0063BE; text-decoration: underline;}
#secondContent .smb-step__item__number { align-items: center; background-color: var(--blue); border-radius: 100%; color: #fff; display: flex; height: min(var(--comp-50), 50px); justify-content: center; overflow: hidden; width: min(var(--comp-50), 50px); font-size: min(var(--comp-24), 18px); line-height: 1; position: absolute; top: 0; left: 0; box-sizing: border-box;}
#secondContent .smb-step__item__number:before { content: counter(item); counter-increment: item; }
#secondContent .smb-step__item__summary p{ padding-left: min(var(--comp-80), 100px); overflow-wrap:anywhere;}
#secondContent .smb-step__item{ margin-left: 0; position: relative;}
.smb-step__body>*+*{ margin-top: 0;}

@media screen and (width <= 900px){
#secondContent .smb-step__item__number { padding:0 0 0.3vw 0.3vw;}
}

/*-- profile --*/
#secondContent .todaroumu-profile-list{ display: flex; flex-wrap: wrap; column-gap: min(var(--comp-30), 30px); row-gap: min(var(--comp-80), 60px); width: 100%; margin: min(var(--comp-80), 60px) auto;}
#secondContent .todaroumu-profile-list > li{ width: calc((100% - min(var(--comp-30), 30px) - min(var(--comp-30), 30px) - 1px) / 3);}
#secondContent .todaroumu-profile-list > li > a{ display: flex; flex-direction: column; position: relative; border-bottom: 1px solid var(--gray); padding-bottom: min(var(--comp-60), 20px); height: 100%;}
#secondContent .todaroumu-profile-list > li > a figure{ margin: 0 auto min(var(--comp-55), 25px); display: block;}
#secondContent .todaroumu-profile-list > li > a .license{ font-size: min(var(--comp-26), 16px); line-height: 1.73; margin: 0 auto min(var(--comp-10), 5px); }
#secondContent .todaroumu-profile-list > li > a .group{ color: var(--darkgray); font-size: min(var(--comp-24), 14px); line-height: 1.73; margin: 0 auto min(var(--comp-40), 20px); font-feature-settings: "palt"; letter-spacing: 0.05em;}
#secondContent .todaroumu-profile-list > li > a .name{ color: var(--base-font-color); font-size: min(var(--comp-46), 26px); line-height: 1.73; margin: auto auto 0; font-feature-settings: "palt"; letter-spacing: 0.05em;}
#secondContent .todaroumu-profile-list > li > a::before{ content: ""; display: block; height: 1px; position: absolute; bottom: -1px; left: 0; transform: scaleX(0); transform-origin: top right; transition: transform 0.7s ease; background-color: var(--navy); width: 100%; height: 1px;}

/*-- sitemap --*/
#sitemap_list li li{ margin: 0; background: none; padding: 0;}
#secondContent #sitemap_list > li{ position: relative; border-bottom: 1px solid var(--gray); padding: 0 0 min(var(--comp-35), 25px);}
#secondContent #sitemap_list > li:not(:last-child){ margin-bottom: min(var(--comp-35), 25px);}
#secondContent #sitemap_list > li > a{ display: block; font-size: min(var(--comp-26), 18px); display: inline-block; line-height: 1.923; margin: 0; padding: 0; background-color: transparent; border: none;}
#secondContent #sitemap_list > li ul{ display: block; padding: 0 0 0 min(var(--comp-40), 40px); margin-top: min(var(--comp-60), 60px); line-height: 1.875;}
#secondContent #sitemap_list > li > ul{ padding: 0 0 min(var(--comp-15), 25px) min(var(--comp-40), 40px);}
#secondContent #sitemap_list > li ul > li:not(:last-child){ margin-bottom: min(var(--comp-30), 15px); }
#secondContent #sitemap_list > li ul > li > a{ font-size: min(var(--comp-24), 16px);}

/*-- prices top --*/
/*table*/
#secondContent .pricesTopTableBox{ margin: min(var(--comp-85), 60px) auto min(var(--comp-80), 70px);}
#secondContent .pricesTopTableHead{ position: relative;}
#secondContent .wrapPricesTableIconBox{ position: absolute; bottom: 24.3902439%; width: 100%;}
#secondContent .wrapPricesTableIconBox .wp-block-group__inner-container{ display: contents;}
#secondContent .wrapPricesTableIconBox .pricesTableIconBox{ pointer-events: none; width: 3.3333333333333%; position: absolute; top: 0; left: 0; }
#secondContent .wrapPricesTableIconBox .pricesTableIconBox:nth-child(1){ left: 23%; }
#secondContent .wrapPricesTableIconBox .pricesTableIconBox:nth-child(2){ left: 40%; }
#secondContent .wrapPricesTableIconBox .pricesTableIconBox:nth-child(3){ left: 56.66666666666666%; }
#secondContent .wrapPricesTableIconBox .pricesTableIconBox:nth-child(4){ left: 73.44444444444444%; }
#secondContent .wrapPricesTableIconBox .pricesTableIconBox:nth-child(5){ left: 90.22222222222222%; }
#secondContent .wrapPricesTableIconBox .pricesTableIcon{  pointer-events: all; cursor: pointer;}
#secondContent .wrapPricesTableIconBox .textBox{ position: absolute; left: 50%; top: 216.66666666666%; transform: translateX(-50%); opacity: 0; pointer-events: none; border: 1px solid #C4C4C5; background-color: #fff; transition: opacity 0.3s ease; width: 850%; padding: min(var(--comp-35), 30px) min(var(--comp-40), 30px); box-sizing: border-box}
#secondContent .wrapPricesTableIconBox .textBox::before{ content: ""; display: block; background-color: #C4C4C5; width: min(4.054054054054vw, 30px); aspect-ratio: 30 / 20; position: absolute; top: 0; left: 50%; clip-path: polygon(0 100%, 50% 0, 100% 100%); transform: translateY(-100%) translateX(-50%);}
#secondContent .wrapPricesTableIconBox .textBox::after{ content: ""; display: block; background-color: #fff; width: min(4.054054054054vw, 30px); aspect-ratio: 30 / 20; position: absolute; top: 1.5px; left: 50%; clip-path: polygon(0 100%, 50% 0, 100% 100%); transform: translateY(-100%) translateX(-50%);}
#secondContent .wrapPricesTableIconBox .pricesTableIconBox:nth-child(5) .textBox{ left: -80%;}
#secondContent .wrapPricesTableIconBox .pricesTableIconBox:nth-child(5) .textBox::before{ left: 66%;}
#secondContent .wrapPricesTableIconBox .pricesTableIconBox:nth-child(5) .textBox::after{ left: 66%; }
#secondContent .wrapPricesTableIconBox .textBox.active{ pointer-events: all; opacity: 1; }
#secondContent .wrapPricesTableIconBox .textBox .catch{ font-size: min(var(--comp-26), 16px); margin: 0 auto min(var(--comp-20), 15px); line-height: 1.5625;}
#secondContent .wrapPricesTableIconBox .textBox p:not(.catch){ font-size: min(var(--comp-20), 14px); line-height: 1.75;}
#secondContent .wrapPricesTableIconBox .textBox .catch + p{ margin-top: 0;}

/*tab*/
#secondContent .pricesTopTabTypeList{ gap: 0; justify-content: space-between; flex-wrap: wrap !important; margin-bottom: 0.8620689% !important;}
#secondContent .pricesTopTabTypeList .wp-block-column:nth-child(1),
#secondContent .pricesTopTabTypeList .wp-block-column:nth-child(2){ width: 39.55555555555555%; flex-grow: 0; flex-basis: auto; position: relative;}
#secondContent .pricesTopTabTypeList .wp-block-column:nth-child(3){ width: 19.55555555555555%; flex-grow: 0; flex-basis: auto; position: relative;}
#secondContent .pricesTopTabTypeList .wp-block-column .wp-block-image:nth-child(1){ position: relative; opacity: 0; transition: opacity 0.3s ease; z-index: 2 }
#secondContent .pricesTopTabTypeList .wp-block-column .wp-block-image:nth-child(2){ position: absolute; top: 0; left: 0; opacity: 1; z-index: 1 }
#secondContent .pricesTopTabTypeList .wp-block-column .wp-block-image{ width: 100%;}
#secondContent #pricesTopTabList{ margin-top: 0; gap: 0; justify-content: space-between; margin-bottom: 0;}
#secondContent #pricesTopTabList .wp-block-column{ width: 19.4444444444444%; flex-grow: 0; flex-basis: auto; cursor: pointer; position: relative;}
#secondContent #pricesTopTabList .wp-block-column .wp-block-image:nth-child(1){ position: relative; opacity: 0; transition: opacity 0.3s ease; z-index: 2 }
#secondContent #pricesTopTabList .wp-block-column .wp-block-image:nth-child(2){ position: absolute; top: 0; left: 0; z-index: 1}
#secondContent #pricesTopTabList .wp-block-column .wp-block-image{ width: 100%;}
#secondContent #pricesTopTabList .wp-block-column:hover .wp-block-image:nth-child(1),
#secondContent #pricesTopTabList .wp-block-column.active .wp-block-image:nth-child(1){ opacity: 1;}
#secondContent .pricesTopTabTypeList:has( + #pricesTopTabList .wp-block-column:nth-child(1):hover) .wp-block-column:nth-child(1) .wp-block-image:nth-child(1),
#secondContent .pricesTopTabTypeList:has( + #pricesTopTabList .wp-block-column:nth-child(1).active) .wp-block-column:nth-child(1) .wp-block-image:nth-child(1),
#secondContent .pricesTopTabTypeList:has( + #pricesTopTabList .wp-block-column:nth-child(2):hover) .wp-block-column:nth-child(1) .wp-block-image:nth-child(1),
#secondContent .pricesTopTabTypeList:has( + #pricesTopTabList .wp-block-column:nth-child(2).active) .wp-block-column:nth-child(1) .wp-block-image:nth-child(1){ opacity: 1; }
#secondContent .pricesTopTabTypeList:has( + #pricesTopTabList .wp-block-column:nth-child(3):hover) .wp-block-column:nth-child(2) .wp-block-image:nth-child(1),
#secondContent .pricesTopTabTypeList:has( + #pricesTopTabList .wp-block-column:nth-child(3).active) .wp-block-column:nth-child(2) .wp-block-image:nth-child(1),
#secondContent .pricesTopTabTypeList:has( + #pricesTopTabList .wp-block-column:nth-child(4):hover) .wp-block-column:nth-child(2) .wp-block-image:nth-child(1),
#secondContent .pricesTopTabTypeList:has( + #pricesTopTabList .wp-block-column:nth-child(4).active) .wp-block-column:nth-child(2) .wp-block-image:nth-child(1){ opacity: 1; }
#secondContent .pricesTopTabTypeList:has( + #pricesTopTabList .wp-block-column:nth-child(5):hover) .wp-block-column:nth-child(3) .wp-block-image:nth-child(1),
#secondContent .pricesTopTabTypeList:has( + #pricesTopTabList .wp-block-column:nth-child(5).active) .wp-block-column:nth-child(3) .wp-block-image:nth-child(1){ opacity: 1; }
#secondContent .pricesTopBox.active{ display: block; opacity: 1; height: auto; transition: opacity 0.5s ease, display 0.5s ease;}
#secondContent .pricesTopBox{ border: 1px solid #C4C4C5; border-top: none; box-sizing: border-box; padding: min(var(--comp-95), 70px) min(var(--comp-40), 60px) min(var(--comp-80), 60px); opacity: 0; margin: calc(min(1.6666666666%, 15px) * (-1)) auto 0;  display: none;}
#secondContent .pricesTopBox .pricesTopCatch{ font-size: min(var(--comp-34), 22px); font-weight: 500; margin: min(var(--comp-30), 25px) auto;}
#secondContent .pricesTopBox .pricesTopCatch:first-child{ margin-top: 0;}
#secondContent .pricesTopBox .pricesTopCatch:last-child{ margin-bottom: 0;}
#secondContent .pricesTopBox .pricesTopCatch + *{ margin-top: 0 !important;}
#secondContent .pricesTopBox h4{ padding: 0; color: var(--base-font-color); font-size: min(var(--comp-30), 22px); margin: 0 auto min(var(--comp-30), 25px); }
#secondContent .pricesTopBox h4::after{ content: none;}
#secondContent .pricesTopBox h4 + *{ margin-top: 0 !important;}
#secondContent .pricesTopBox .pricesTopDetailList{ display: flex; width: 100%; gap: min(var(--comp-16), 18px); flex-wrap: wrap; justify-content: flex-start !important; margin: min(var(--comp-80), 60px) auto 0;}
#secondContent .pricesTopBox .pricesTopDetailList .wp-block-group__inner-container{ display: contents;}
#secondContent .pricesTopBox .pricesTopDetailList .wp-block-image{ width: calc((100% - (min(var(--comp-16), 18px) * 2) - 1px) / 3); background-color: var(--lightgray); box-sizing: border-box; padding: min(var(--comp-30), 30px) min(var(--comp-17), 20px); display: flex; flex-direction: column; justify-content: center; margin: 0;}
#secondContent .pricesTopBox .pricesTopDetailList .wp-block-image img{ width: 100%;}

/*-- prices detail --*/
/*table*/
#secondContent .pricesDetailTableBox{ position: relative;}
#secondContent .wp-block-group__inner-container{ display: contents;}
#secondContent .pricesDetailTable{ margin: 0; position: relative;}
#secondContent .pricesDetailTableBox .pricesDetailTableBtn{ margin: 0; position: absolute; top: 30.7692307%; left: 0; width: 100%;}
#secondContent .pricesDetailTableBox .pricesDetailTableBtn .wp-block-column{ width: 13.3333333333333333%; position: absolute; top: 0;}
#secondContent .pricesDetailTableBox .pricesDetailTableBtn .wp-block-column:nth-child(1){ left: 13.11111111111%;}
#secondContent .pricesDetailTableBox .pricesDetailTableBtn .wp-block-column:nth-child(2){ left: 53.33333333333%;}
#secondContent .pricesDetailTableBox .pricesDetailTableBtn .wp-block-column:nth-child(3){ left: 83.55555555555%;}

/*planBox*/
#secondContent .planDetailBox{ margin-top: calc(min(var(--comp-80), 60px) + (min(var(--comp-30), 30px) * (-1))); padding-top: min(var(--comp-30), 30px); }
#secondContent #consulting.planDetailBox > .wp-block-group__inner-container{ border: 2px solid #0063BE; display: block; } 
#secondContent #advisor.planDetailBox > .wp-block-group__inner-container{ border: 2px solid #1C8BF3; display: block; }
#secondContent #customization.planDetailBox > .wp-block-group__inner-container{ border: 2px solid #004282; display: block; }
#secondContent .planDetailBox .planDetailHead{ margin: 0;}
#secondContent #consulting.planDetailBox .planDetailHead{ background-color: #0063BE !important; padding: min(var(--comp-40), 30px) 0 !important;}
#secondContent #advisor.planDetailBox .planDetailHead{ background-color: #1C8BF3 !important; padding: min(var(--comp-40), 30px) 0 !important;}
#secondContent #customization.planDetailBox .planDetailHead{ background-color: #004282 !important; padding: min(var(--comp-40), 30px) 0 !important;}
#secondContent .planDetailBox .planDetailHead .catch{ text-align: center; font-size: min(var(--comp-30), 22px); font-weight: 500; margin: 0;}
#secondContent .planDetailBox .planDetailHead .name{ font-size: min(var(--comp-42), 34px); text-align: center; font-weight: 500; line-height: 1.4; margin: 0;}
#secondContent .planDetailBox .planDetailHead .name .has-small-font-size{ font-size: min(var(--comp-30), 22px) !important; display: block;}
#secondContent .planDetailBox .planDetailLead{ font-weight: 500;}
#secondContent .planDetailBox .innerPlanDetailBox{ padding: min(var(--comp-80), 60px) min(var(--comp-40), 60px); box-sizing: border-box;}
#secondContent .planDetailTab01{ gap: 6px;}
#secondContent .planDetailTab01 .innerPlanDetailTab01{ position: relative; cursor: pointer;}
#secondContent .planDetailTab01 .innerPlanDetailTab01:has( .wp-block-image:only-child){ cursor: auto;}
#secondContent .planDetailTab01 .innerPlanDetailTab01 .wp-block-image{ width: 100%;}
#secondContent .planDetailTab01 .innerPlanDetailTab01 .wp-block-image:first-child{ opacity: 0; position: relative; z-index: 2; transition: opacity 0.3s ease;}
#secondContent .planDetailTab01 .innerPlanDetailTab01 .wp-block-image:last-child{ opacity: 1; position: absolute; top: 0; left: 0; z-index: 1; }
#secondContent .planDetailTab01 .innerPlanDetailTab01 .wp-block-image:only-child{ opacity: 1; position: relative; z-index: 2; transition: opacity 0.3s ease;}
#secondContent .planDetailTab01 .innerPlanDetailTab01 .wp-block-image img{ width: 100%;}
#secondContent .planDetailTab01 .innerPlanDetailTab01:hover .wp-block-image:first-child,
#secondContent .planDetailTab01 .innerPlanDetailTab01.active .wp-block-image:first-child{ opacity: 1;}
#secondContent .planDetailBox .pricesDetail{ display: none;}
#secondContent .planDetailBox .pricesDetail.active{ display: block;}
#secondContent .planDetailBox .monthlyFee{ width: min(100%, 385px); margin: 0 auto ;}
#secondContent .planDetailBox .planDetailPlanLead{ margin-bottom: min(var(--comp-80), 60px);}
#secondContent .pricesDetailList{ display: flex; width: 100%; gap: min(var(--comp-16), 18px); flex-wrap: wrap; justify-content: flex-start !important; margin: min(var(--comp-80), 60px) auto 0; }
#secondContent .pricesDetailList > .wp-block-group__inner-container > .wp-block-image,
#secondContent .pricesDetailList > .wp-block-group__inner-container > .wp-block-group{ width: calc((100% - (min(var(--comp-16), 18px) * 2) - 1px) / 3); background-color: var(--lightgray); box-sizing: border-box; padding: min(var(--comp-30), 30px) min(var(--comp-17), 20px); display: flex; flex-direction: column; justify-content: center; margin: 0; }
#secondContent .planDetailBox hr:has( + .accordionBtn){ margin-bottom: 0; margin-top: min(var(--comp-80), 60px);}
#secondContent .planDetailBox .accordionBtn{ display: flex; justify-content: space-between; align-items: center; cursor: pointer; padding: min(var(--comp-60), 30px) 0;}
#secondContent .planDetailBox .accordionBtn .accordionText{ margin: 0; font-size: min(var(--comp-30), 20px); font-weight: 500;}
#secondContent .planDetailBox .accordionBtn .accordionIcon{ width: min(var(--comp-30), 19px); position: relative;}
#secondContent .planDetailBox .accordionBtn .accordionIcon .wp-block-image:first-child{ position: absolute; top: 0; left: 0; opacity: 1; transition: opacity 0.2s ease;}
#secondContent .planDetailBox .accordionBtn .accordionIcon .wp-block-image:last-child{ position: relative; opacity: 0; transition: opacity 0.2s ease;}
#secondContent .planDetailBox .accordionBtn.active .accordionIcon .wp-block-image:first-child{ opacity: 0;}
#secondContent .planDetailBox .accordionBtn.active .accordionIcon .wp-block-image:last-child{ opacity: 1;}
#secondContent .planDetailBox .accordionOpenBox{ display: none;}
#secondContent .planDetailBox .accordionOpenBox + hr{ margin-top: 0;}
#secondContent .planDetailBox .innerAccordionBox{ padding-bottom: min(var(--comp-80), 60px); }
#secondContent .planDetailBox .ttl{ margin: min(var(--comp-80), 60px) auto min(var(--comp-40), 30px); font-size: min(var(--comp-34), 22px);}
#secondContent .planDetailBox .ttl + *{ margin-top: 0 !important;}
#secondContent .planDetailBox .has-medium-font-size{ font-size: min(var(--comp-30), 18px);}

/*-- prices laborers-fee --*/
/*table*/
#secondContent .priceLaborersTableBox{ position: relative; margin: min(var(--comp-80), 60px) auto;}
#secondContent .priceLaborersTable{ margin: 0; position: relative;}
#secondContent .priceLaborersTableBox .pricesLaborersTableBtn{ margin: 0; position: absolute; top: 25.1748251%; left: 0; width: 100%;}
#secondContent .priceLaborersTableBox .pricesLaborersTableBtn .wp-block-column{ width: 13.3333333333333333%; position: absolute; top: 0;}
#secondContent .priceLaborersTableBox .pricesLaborersTableBtn .wp-block-column:nth-child(1){ left: 13.11111111111%;}
#secondContent .priceLaborersTableBox .pricesLaborersTableBtn .wp-block-column:nth-child(2){ left: 53.33333333333%;}
#secondContent .priceLaborersTableBox .pricesLaborersTableBtn .wp-block-column:nth-child(3){ left: 83.55555555555%;}

/*box*/
#secondContent .pricesGrayGridBox{ display: flex; flex-wrap: wrap; gap: min(var(--comp-80), 60px); margin: min(var(--comp-80), 60px) auto;}
#secondContent .pricesGrayGridBox .innerPricesGrayGridBox{ width: calc((100% - min(var(--comp-80), 60px) - 1px) / 2); background-color: var(--lightgray); padding: min(var(--comp-50), 35px) min(var(--comp-60), 40px) min(var(--comp-70), 50px); margin: 0;}
#secondContent .pricesGrayGridBox .innerPricesGrayGridBox .centerBdrttl{ font-size: min(var(--comp-38), 26px); transform: translateX(calc(min(var(--comp-30), 10px) * (-1))); width: calc(100% + (min(var(--comp-30), 10px) * 2)); border-bottom: 1px solid var(--gray); line-height: 1.7; padding-bottom: min(var(--comp-50), 30px); margin-bottom: min(var(--comp-60), 40px); max-width: 200%;}
#secondContent .pricesGrayGridBox .innerPricesGrayGridBox .wp-block-image img{ width: auto; max-width: 100%; display: block; margin: 0 auto;}
#secondContent .pricesGrayGridBox .innerPricesGrayGridBox hr{ transform: translateX(calc(min(var(--comp-30), 10px) * (-1))); width: calc(100% + (min(var(--comp-30), 10px) * 2)); max-width: 200%;}

/*-- prices eap-cost --*/
/*table*/
#secondContent .pricesEapTableBox{ position: relative; margin: min(var(--comp-80), 60px) auto;}
#secondContent .pricesEapTable{ margin: 0; position: relative;}
#secondContent .pricesEapTableBox .pricesEapTableBtn{ margin: 0; position: absolute; top: 23.1065468%; left: 0; width: 100%;}
#secondContent .pricesEapTableBox .pricesEapTableBtn .wp-block-column{ width: 13.3333333333333333%; position: absolute; top: 0;}
#secondContent .pricesEapTableBox .pricesEapTableBtn .wp-block-column:nth-child(1){ left: 13.11111111111%;}
#secondContent .pricesEapTableBox .pricesEapTableBtn .wp-block-column:nth-child(2){ left: 53.33333333333%;}
#secondContent .pricesEapTableBox .pricesEapTableBtn .wp-block-column:nth-child(3){ left: 83.55555555555%;}

/*-- cost-details --*/
/*text*/
#secondContent .pricesSubTypeText{ font-size: min(var(--comp-26), 18px); margin-top: min(var(--comp-80), 60px);}
#secondContent .pricesSubTypeText .sme-bg-color{ padding: min(var(--comp-10), 10px) min(var(--comp-30), 20px); min-width: min(var(--comp-200), 135px); text-align: center; display: inline-block; line-height: 1.4;}
#secondContent .pricesSubTypeText:has( + .pricesBlueText){ margin-bottom: 0;}
#secondContent .pricesBlueText{ font-size: min(var(--comp-34), 22px) !important; margin-bottom: min(var(--comp-20), 15px);}
#secondContent .pricesBlueText,
#secondContent .pricesBlueText strong{ font-weight: 600;}
#secondContent .pricesBlueText:has( + .pricesBlueText){ margin-bottom: 0;}
#secondContent .pricesSubTypeText + .pricesBlueText{ margin-top: min(var(--comp-30), 20px); line-height: 1.8;}
#secondContent .pricesBlueText + p:not(.pricesSubTypeText){ margin-top: 0;}

/*table*/
#secondContent .cost-detailsTableBox{ margin: min(var(--comp-80), 60px) auto;}
#secondContent .cost-detailsTableBox .wrapCost-detailsTableHead{ position: relative;}
#secondContent .cost-detailsTableBox .wrapCost-detailsTableHead .cost-detailsTableBtn{ padding-top: 20%; position: absolute; top: 0; left: 0; width: 100%; margin: 0; display: block;}
#secondContent .cost-detailsTableBox .wrapCost-detailsTableHead .cost-detailsTableBtn .wp-block-column{ width: 3.33333333333333%; position: absolute; bottom: 0; transform: translateY(100%);}
#secondContent .cost-detailsTableBox .wrapCost-detailsTableHead .cost-detailsTableBtn .wp-block-column:nth-child(1){ left: 40.166666666666666666%;}
#secondContent .cost-detailsTableBox .wrapCost-detailsTableHead .cost-detailsTableBtn .wp-block-column:nth-child(2){ left: 53.166666666666666666%;}
#secondContent .cost-detailsTableBox .wrapCost-detailsTableHead .cost-detailsTableBtn .wp-block-column:nth-child(3){ left: 66.166666666666666666%;}
#secondContent .cost-detailsTableBox .wrapCost-detailsTableHead .cost-detailsTableBtn .wp-block-column:nth-child(4){ left: 79.166666666666666666%;}
#secondContent .cost-detailsTableBox .wrapCost-detailsTableHead .cost-detailsTableBtn .wp-block-column:nth-child(5){ left: 92.166666666666666666%;}

@media screen and (1280px < width <= 1430px){
#secondContent .pricesGrayGridBox .innerPricesGrayGridBox{ width: 100%; }
}

@media screen and (width <= 1100px){
#secondContent .pricesTopBox .pricesTopDetailList .wp-block-image,
#secondContent .pricesDetailList > .wp-block-group__inner-container > .wp-block-image,
#secondContent .pricesDetailList > .wp-block-group__inner-container > .wp-block-group{ width: calc((100% - min(var(--comp-16), 18px) - 1px) / 2); }
}

@media screen and (width <= 950px){
#secondContent .pricesGrayGridBox .innerPricesGrayGridBox{ width: 100%; }
}

/*-- cost-details --*/
#secondContent .tag-filter{ width: 100%; display: flex; flex-wrap: wrap; gap: min(var(--comp-20), 15px); margin: min(var(--comp-60), 50px) auto min(var(--comp-40), 30px);}
#secondContent .tag-filter .tag-btn{ color: #fff; font-size: min(var(--comp-24), 14px); font-weight: 600; display: inline-block; background-color: #d1d7dd; padding: min(var(--comp-10), 7px) min(var(--comp-30), 20px); }
#secondContent .tag-filter .tag-btn.active{ background-color: var(--navy);}

@media (any-hover: hover) {

}

/*-- common --*/
/*margin*/
#secondContent .wp-block-table,
#secondContent .wp-block-flexible-table-block-table,
#secondContent .is-layout-flex,
#secondContent div:has( > iframe){ margin: min(var(--comp-80), 60px) auto;}

#secondContent .mb00{ margin-bottom: 0 !important;}
#secondContent .mb00 + *{ margin-top: 0 !important;}
#secondContent .mb100{ margin-bottom: min(var(--comp-100), 100px) !important;}
#secondContent .mb120{ margin-bottom: min(var(--comp-120), 120px) !important;}
#secondContent .mt50{ margin-top: min(var(--comp-50), 50px) !important;}
#secondContent .mt60{ margin-top: min(var(--comp-60), 60px) !important;}
#secondContent .mt70{ margin-top: min(var(--comp-70), 70px) !important;}
#secondContent .mt80{ margin-top: min(var(--comp-80), 80px) !important;}
#secondContent .mt90{ margin-top: min(var(--comp-90), 90px) !important;}
#secondContent .mt100{ margin-top: min(var(--comp-100), 100px) !important;}
#secondContent .mt110{ margin-top: min(var(--comp-110), 110px) !important;}
#secondContent .mt120{ margin-top: min(var(--comp-120), 120px) !important;}

/*width*/
#secondContent h2,
#secondContent h3,
#secondContent h4,
#secondContent p,
#secondContent .wp-block-table,
#secondContent .wp-block-flexible-table-block-table,
#secondContent .is-layout-flex,
#secondContent .wp-block-list,
#secondContent div:has( > iframe){ width: 100%; font-family: var(--base-font);}

/*first-child*/
#secondContent h2:first-child,
#secondContent h3:first-child,
#secondContent h4:first-child,
#secondContent p:first-child,
#secondContent .wp-block-table:first-child,
#secondContent > table:first-child,
#secondContent .wp-block-flexible-table-block-table:first-child,
#secondContent .is-layout-flex:first-child,
#secondContent .wp-block-list:first-child,
#secondContent .linkListtype01:first-child,
#secondContent .linkListtype02:first-child,
#secondContent .linkBtnType01:first-child,
#secondContent div:has( > iframe):first-child,
#secondContent .smb-btn-box:first-child{ margin-top: 0;}
#secondContent h2:first-child > span.ez-toc-section,
#secondContent h3:first-child > span.ez-toc-section{ padding-top: 0; margin-top: 0;}

/*last-child*/
#secondContent h2:last-child,
#secondContent h3:last-child,
#secondContent h4:last-child,
#secondContent p:last-child,
#secondContent .wp-block-table:last-child,
#secondContent > table:last-child,
#secondContent .wp-block-flexible-table-block-table:last-child,
#secondContent .is-layout-flex:last-child,
#secondContent .wp-block-list:last-child,
#secondContent .linkListtype01:last-child,
#secondContent .linkListtype02:last-child,
#secondContent .linkBtnType01:last-child,
#secondContent div:has( > iframe):last-child,
#secondContent .smb-btn-box:last-child{ margin-bottom: 0;}

/*margin-bottom: 0;*/
#secondContent p:has(.wpcf7-radio),
#secondContent p:has(.wpcf7-checkbox){ margin: 0 auto !important;}


@media (any-hover: hover) {
#secondContent .todaroumu-profile-list > li > a:hover{ opacity: 1;}
#secondContent .todaroumu-profile-list > li > a:hover::before{ transform: scaleX(100%); transform-origin: top left;}
}

@media screen and (width <= 980px){
#secondContent .todaroumu-profile-list > li{ width: calc((100% - min(var(--comp-30), 30px) - 1px) / 2);}
}

@media screen and (width <= 800px){
/*-- float --*/
#secondContent .wp-block-image{ margin: 0 auto;}
#secondContent .wp-block-image .alignright { float: none; margin: min(var(--comp-80), 60px) auto; width: 100%;}
#secondContent .wp-block-image .alignleft { float: none; margin: min(var(--comp-80), 60px) auto; width: 100%;}
#secondContent .wp-block-image:first-child .alignright,
#secondContent .wp-block-image:first-child .alignleft { margin-top: 0;}

/*-- flex --*/
#secondContent .is-layout-flex{ flex-wrap: wrap; }
#secondContent .is-layout-flex .wp-block-column-is-layout-flow{ width: 100%;}

/*-- list --*/
#secondContent .linkListtype01 li,
#secondContent .linkListtype01 > .wp-block-group__inner-container > .wp-block-group{ width: 100%;}
#secondContent .linkListtype02 li,
#secondContent .linkListtype02 .innerLinkListtype02 > .wp-block-group__inner-container{ display: block; }
#secondContent .linkListtype02 figure{ width: 100%; transition: all ease 0.5s; margin-bottom: min(var(--comp-35), 35px);}
#secondContent .linkListtype02 figure:has( + .textBox > .ttl > a:hover){ opacity: 0.7;}
#secondContent .linkListtype02 .textBox{ width: 100%;}
#secondContent .linkListtype02 .ttl a::before{  width: 100%;}
#secondContent .textDataList02 .wp-block-group__inner-container .innertextDataList02{ display: block; padding-bottom: min(var(--comp-30), 30px); }
#secondContent .textDataList02 .wp-block-group__inner-container .innertextDataList02 .date{ width: 100%; margin-bottom: min(var(--comp-10), 10px); }
#secondContent .textDataList02 .wp-block-group__inner-container .innertextDataList02 .wp-block-list.simpleList01{ width: 100% !important; }
#secondContent .mediaDataList01 .innerMediaDataList01 > .wp-block-group__inner-container > figure{ width: 100%;}
#secondContent .mediaDataList01 .innerMediaDataList01 .textBox{ width: 100%;}
#secondContent .mediaDataList01 .innerMediaDataList01 .textBox .is-layout-flex .wp-block-button{ margin: 0 auto 0 0;}

/*-- link --*/
#secondContent .wp-block-image.linkBtnType01{ max-width: 100%; width: 100%;}

/*-- button --*/
#secondContent .is-layout-flex.wp-block-buttons > .wp-block-button{ margin: 0 auto;}

/*-- profile --*/
#secondContent .todaroumu-profile-list li{ width: 100%;}

/*-- roumuouen-konsaru --*/
#secondContent .roumuouen_consaruTopBox,
#secondContent .roumuouen_consaruTopBox > .wp-block-group__inner-container{ margin: 0 auto; gap: min(var(--comp-70), 70px);}
#secondContent .roumuouen_consaruTopBox .wp-block-image{ width: 100%;}
#secondContent .roumuouen_consaruTopBox .roumuouen_consaruTopTextBox{ width: 100%; display: block;}
#secondContent .roumuouen_consaruTopBox .roumuouen_consaruTopTextBox .smb-btn-box__btn-wrapper{ width: min(67.567567567vw, 500px); margin: min(var(--comp-70), 70px) auto 0;}
#secondContent .roumuouen_consaruTopBox .roumuouen_consaruTopTextBox .wp-block-buttons{ width: min(67.567567567vw, 500px); margin: min(var(--comp-30), 30px) auto 0;}
#secondContent .phaseBox .phaseHead{ position: sticky; top: 0; left: 0; z-index: 2;}

/*-- prices top --*/
/*table*/
#secondContent .pricesTopTableHead{ position: sticky; top: 0; left: 0; width: 100%; margin-left: auto; margin-right: auto; background-color: #fff;}
#secondContent .wrapPricesTableIconBox{ bottom: 20.2531645%;}
#secondContent .wrapPricesTableIconBox .pricesTableIconBox{ width: 6.8965517%; }
#secondContent .wrapPricesTableIconBox .pricesTableIconBox:nth-child(1){ left: 6.0344827%; }
#secondContent .wrapPricesTableIconBox .pricesTableIconBox:nth-child(2){ left: 26.3793103%; }
#secondContent .wrapPricesTableIconBox .pricesTableIconBox:nth-child(3){ left: 46.5517241%; }
#secondContent .wrapPricesTableIconBox .pricesTableIconBox:nth-child(4){ left: 66.7241379%; }
#secondContent .wrapPricesTableIconBox .pricesTableIconBox:nth-child(5){ left: 86.8965517%; }
#secondContent .wrapPricesTableIconBox .textBox{ top: 216.66666666666%; width: 825%; }
#secondContent .wrapPricesTableIconBox .textBox::before{ width: 4.054054054054vw; aspect-ratio: 30 / 20; }
#secondContent .wrapPricesTableIconBox .textBox::after{ width: 4.054054054054vw; aspect-ratio: 30 / 20; }
#secondContent .wrapPricesTableIconBox .pricesTableIconBox:nth-child(1) .textBox{ left: 322%;}
#secondContent .wrapPricesTableIconBox .pricesTableIconBox:nth-child(1) .textBox::before{ left: 16%;}
#secondContent .wrapPricesTableIconBox .pricesTableIconBox:nth-child(1) .textBox::after{ left: 16%; }
#secondContent .wrapPricesTableIconBox .pricesTableIconBox:nth-child(5) .textBox{ left: -220%;}
#secondContent .wrapPricesTableIconBox .pricesTableIconBox:nth-child(5) .textBox::before{ left: 83%;}
#secondContent .wrapPricesTableIconBox .pricesTableIconBox:nth-child(5) .textBox::after{ left: 83%; }

/*tab*/
#secondContent .pricesTopTabTypeList{ gap: 0; justify-content: space-between; flex-wrap: wrap !important; margin-bottom: 0.666666666666% !important;}
#secondContent .pricesTopTabTypeList .wp-block-column:nth-child(1),
#secondContent .pricesTopTabTypeList .wp-block-column:nth-child(2){ width: 39.4827586%; flex-basis: auto !important; }
#secondContent .pricesTopTabTypeList .wp-block-column:nth-child(3){ width: 19.3103448%; flex-basis: auto !important; }
#secondContent #pricesTopTabList .wp-block-column{ width: 19.3103448%; flex-basis: auto !important;}
#secondContent #pricesTopTabList .wp-block-column .wp-block-image:nth-child(1){ position: relative; opacity: 0; transition: opacity 0.3s ease; z-index: 2 }
#secondContent #pricesTopTabList .wp-block-column .wp-block-image:nth-child(2){ position: absolute; top: 0; left: 0; z-index: 1}
#secondContent .pricesTopBox.active{ display: block; opacity: 1; height: auto; transition: opacity 0.5s ease, display 0.5s ease;}
#secondContent .pricesTopBox{ width: 100%; max-width: 100%; margin-left: auto; margin-right: auto;}
#secondContent .pricesTopBox .pricesTopCatch{ font-size: min(var(--comp-34), 22px); font-weight: 500; margin: min(var(--comp-30), 25px) auto;}
#secondContent .pricesTopBox .pricesTopCatch:first-child{ margin-top: 0;}
#secondContent .pricesTopBox .pricesTopCatch:last-child{ margin-bottom: 0;}
#secondContent .pricesTopBox .pricesTopCatch + *{ margin-top: 0 !important;}
#secondContent .pricesTopBox h4{ padding: 0; color: var(--base-font-color); font-size: min(var(--comp-30), 22px); margin: 0 auto min(var(--comp-30), 25px); }
#secondContent .pricesTopBox h4::after{ content: none;}
#secondContent .pricesTopBox h4 + *{ margin-top: 0 !important;}

/*-- prices detail --*/
#secondContent .pricesDetailTableBox{ width: 100%; margin-left: auto; margin-right: auto;}
#secondContent .pricesDetailTableBox .pricesDetailTableBtn{ top: 34.7593582%;}
#secondContent .pricesDetailTableBox .pricesDetailTableBtn .wp-block-column{ width: 6.8965517%;}
#secondContent .pricesDetailTableBox .pricesDetailTableBtn .wp-block-column:nth-child(1){ left: 16.2931034%;}
#secondContent .pricesDetailTableBox .pricesDetailTableBtn .wp-block-column:nth-child(2){ left: 56.7241379%;}
#secondContent .pricesDetailTableBox .pricesDetailTableBtn .wp-block-column:nth-child(3){ left: 86.8965517%;}

/*planBox*/
#secondContent .planDetailBox{ width: 100%; margin-left: auto; margin-right: auto; }
#secondContent .planDetailBox .innerPlanDetailBox{ padding: min(var(--comp-80), 60px) min(var(--comp-40), 60px); box-sizing: border-box;}
#secondContent #consulting.planDetailBox .planDetailLead{ font-weight: 500; text-align: left !important;}
#secondContent .planDetailTab01{ gap: 6px; flex-wrap: nowrap !important;}
#secondContent .planDetailTab01 .innerPlanDetailTab01{ flex-grow: 0; flex-basis: auto !important;}
#secondContent .planDetailBox .planDetailPlanLead{ text-align: left !important;}

/*-- prices laborers-fee --*/
/*table*/
#secondContent .priceLaborersTableBox{ width: 100%;}
#secondContent .priceLaborersTableBox .pricesLaborersTableBtn{ top: 28.5087719%;}
#secondContent .priceLaborersTableBox .pricesLaborersTableBtn .wp-block-column{ width: 6.8965517%;}
#secondContent .priceLaborersTableBox .pricesLaborersTableBtn .wp-block-column:nth-child(1){ left: 16.2931034%;}
#secondContent .priceLaborersTableBox .pricesLaborersTableBtn .wp-block-column:nth-child(2){ left: 56.7241379%;}
#secondContent .priceLaborersTableBox .pricesLaborersTableBtn .wp-block-column:nth-child(3){ left: 86.8965517%;}

/*box*/
#secondContent .pricesGrayGridBox{ width: 100% !important;}
#secondContent .pricesGrayGridBox .innerPricesGrayGridBox{ width: 100%;}
#secondContent .pricesGrayGridBox .innerPricesGrayGridBox hr{ transform: translateX(calc(min(var(--comp-30), 10px) * (-1))); width: calc(100% + (min(var(--comp-30), 10px) * 2));}

/*-- prices eap-cost --*/
/*table*/
#secondContent .pricesEapTableBox{ width: 100%;}
#secondContent .pricesEapTableBox .pricesEapTableBtn{ top: 26.1674718%; }
#secondContent .pricesEapTableBox .pricesEapTableBtn .wp-block-column{ width: 6.8965517%; }
#secondContent .pricesEapTableBox .pricesEapTableBtn .wp-block-column:nth-child(1){ left: 16.2931034%;}
#secondContent .pricesEapTableBox .pricesEapTableBtn .wp-block-column:nth-child(2){ left: 56.7241379%;}
#secondContent .pricesEapTableBox .pricesEapTableBtn .wp-block-column:nth-child(3){ left: 86.8965517%;}

/*-- cost-details --*/
/*table*/
#secondContent .cost-detailsTableBox{ width: 100%;}
#secondContent .cost-detailsTableBox .wrapCost-detailsTableHead{ position: sticky; top: 0; left: 0; z-index: 2;}
#secondContent .cost-detailsTableBox .wrapCost-detailsTableHead .cost-detailsTableBtn{ padding-top: 40.5172413%; position: absolute; top: 0; left: 0; width: 100%; margin: 0; display: block;}
#secondContent .cost-detailsTableBox .wrapCost-detailsTableHead .cost-detailsTableBtn .wp-block-column{ width: 6.8965517%; position: absolute; bottom: 0; transform: translateY(100%);}
#secondContent .cost-detailsTableBox .wrapCost-detailsTableHead .cost-detailsTableBtn .wp-block-column:nth-child(1){ left: 19.3965517%;}
#secondContent .cost-detailsTableBox .wrapCost-detailsTableHead .cost-detailsTableBtn .wp-block-column:nth-child(2){ left: 36.637931%;}
#secondContent .cost-detailsTableBox .wrapCost-detailsTableHead .cost-detailsTableBtn .wp-block-column:nth-child(3){ left: 53.8793103%;}
#secondContent .cost-detailsTableBox .wrapCost-detailsTableHead .cost-detailsTableBtn .wp-block-column:nth-child(4){ left: 71.1206896%;}
#secondContent .cost-detailsTableBox .wrapCost-detailsTableHead .cost-detailsTableBtn .wp-block-column:nth-child(5){ left: 88.3620689%;}

/*width*/
#secondContent h2,
#secondContent h3,
#secondContent .wp-block-image:has( > .alignright) + h3,
#secondContent h4,
#secondContent p,
#secondContent .wp-block-image:has( > .alignright) + p,
#secondContent .wp-block-table,
#secondContent .wp-block-flexible-table-block-table,
#secondContent .wp-block-image,
#secondContent .is-layout-flex,
#secondContent .wp-block-list,
#secondContent .linkListtype01,
#secondContent .linkListtype02,
#secondContent .textDataList01,
#secondContent .textDataList02,
#secondContent .mediaDataList01,
#secondContent div:has( > iframe),
#secondContent .wpcf7,
#secondContent .wrapcontent01,
#secondContent p.has-background,
#secondContent .post-password-form,
#secondContent .smb-step__body,
#secondContent .smb-step__body,
#secondContent .todaroumu-profile-list,
#secondContent .roumuouen_consaruTopBox,
#secondContent .phaseBox,
#secondContent .has-background,
#secondContent .smb-box,
#secondContent .smb-btn-box,
#secondContent .pricesDetailList,
#secondContent .wp-block-separator{ width: 100%; max-width: 100%;}

#secondContent > table{ width: 100% !important; box-sizing: border-box;}
}