@charset "UTF-8";

/* ==============================
   SMARTPHONE 950px以下
============================== */
html,body{width:100%;overflow-x:hidden;-webkit-overflow-scrolling:touch;}
body{font-size:14px;}
body.menu-open{overflow:hidden;}
.pc{display:none!important;}
.sp{display:block;}
.block,.block800{width:calc(100% - 40px);max-width:none;}
.pa{padding:60px 0;}
.pat0{padding:0 0 60px;}
.pab0{padding:60px 0 0;}
.pt30{padding-top:24px;}
.mb30{margin-bottom:24px;}
.mb40{margin-bottom:30px;}
.mb50{margin-bottom:40px!important;}
.mb80{margin-bottom:50px;}
.w30,.w31,.w33,.w35,.w45,.w50,.w55,.w65{width:100%;}
.block > .flex{display:block;}
.tl{padding-left:28px;margin-bottom:20px;font-size:135%;line-height:1.55;letter-spacing:0.14em;}
.tl::before{top:15px;width:18px;}
.tl_copy{margin:-5px 0 30px;}
.tl_copy p{line-height:190%;}
.btn a{width:100%;height:54px;}
.btn a span::after{right:16px;}
.btns{display:block;padding-top:30px;}
.btns .btn a{margin:0 0 15px;}

/* HEADER */
#head{padding:16px 20px;}
#head #logo{position:relative;z-index:1002;width:170px;}
#head .head-inner{position:relative;}
#head .header-nav{position:absolute;top:calc(100% + 16px);right:-20px;left:-20px;z-index:1000;display:block;max-height:calc(100vh - 72px);padding:0 20px 24px;background:rgba(255,255,255,0.98);box-shadow:0 12px 24px rgba(0,0,0,0.12);overflow-y:auto;opacity:0;visibility:hidden;transform:translateY(-10px);transition:opacity 0.25s ease,visibility 0.25s ease,transform 0.25s ease;}
#head .header-nav.is-open{opacity:1;visibility:visible;transform:translateY(0);}
.menu-toggle{position:relative;z-index:1002;display:block;width:44px;height:44px;border:0;background:transparent;cursor:pointer;}
.menu-toggle span{position:absolute;left:8px;width:28px;height:2px;background:#000;transition:top 0.25s ease,transform 0.25s ease,opacity 0.25s ease;}
.menu-toggle span:nth-child(1){top:12px;}
.menu-toggle span:nth-child(2){top:21px;}
.menu-toggle span:nth-child(3){top:30px;}
.menu-toggle.is-open span:nth-child(1){top:21px;transform:rotate(45deg);}
.menu-toggle.is-open span:nth-child(2){opacity:0;}
.menu-toggle.is-open span:nth-child(3){top:21px;transform:rotate(-45deg);}
#nav.flex{display:block;padding:8px 0 0;}
#nav > li{border-bottom:1px solid #e5e5e5;}
#nav > li > a{display:block;padding:18px 42px 18px 4px;font-size:15px;}
#nav > li > a::after{left:4px;bottom:10px;}
#nav > li.has-submenu > .nav-business-toggle::before{content:"＋";position:absolute;top:50%;right:8px;font-size:20px;line-height:1;transform:translateY(-50%);}
#nav > li.has-submenu.submenu-open > .nav-business-toggle::before{content:"－";}
#nav > li > ul{position:static;width:100%;max-height:0;background:rgba(105,163,216,0.1);box-shadow:none;opacity:1;visibility:visible;pointer-events:auto;overflow:hidden;transform:none;transition:max-height 0.3s ease;}
#nav > li.submenu-open > ul{max-height:320px;padding: 20px 0}
#nav > li:hover > ul,#nav > li:focus-within > ul{transform:none;}
#nav > li > ul > li > a{padding:13px 16px;font-size:13px;white-space:normal;background-image:none;}
#nav > li > ul > li > a:hover,#nav > li > ul > li > a:focus-visible{color:#000;background:#eef8f5;}
#head .header-nav .btn{margin-top:20px;}
#head .header-nav .btn a{width:100%;height:48px;}

/* FOOTER */
#foot > div.flex{display:block;padding:40px 20px 50px;}
#foot dl.flex{display:block;border-bottom:1px solid rgba(255,255,255,0.18);}
#foot dt{padding:0 0 15px;}
#foot dl > dd{border-top:1px solid rgba(255,255,255,0.18);}
#foot dl > dd > a{padding:14px 4px;}
#foot dl > dd > a::after{left:4px;bottom:7px;}
#foot .footer-business__menu{position:static;width:100%;padding:0 0 8px;background:transparent;box-shadow:none;opacity:1;visibility:visible;pointer-events:auto;transform:none;}
#foot .footer-business__menu > li > a{padding:10px 20px;color:rgba(255,255,255,0.75);font-size:12px;white-space:normal;background-image:none;position: relative;}
#foot .footer-business__menu > li > a:before{content:"";display: block;height: 2px;width: 10px;background: rgba(255,255,255,0.5);position: absolute;top:50%;margin-top: -1px;left:4px;}
#foot .footer-business__menu > li > a:hover,#foot .footer-business__menu > li > a:focus-visible{color:#fff;background:transparent;}
#foot .footer-business:hover .footer-business__menu,#foot .footer-business:focus-within .footer-business__menu{transform:none;}
#foot p{padding:28px 0 0;text-align:center;}

/* FIRST VIEW / MAIN VIEW */
.asset-puzzle{width:100%;max-width:none;margin-top:20px;aspect-ratio:auto;overflow:hidden;touch-action:pan-y;}
.first-view__content p.tl_img{width:calc(100% - 20vw);margin:28px auto 0;}
.first-view p.arw{margin-top:40px;}
#second #mainview{min-height:clamp(220px,38vw,330px);overflow:hidden;}
#second #mainview p{width:100%;padding:0;}
#second #mainview p img{display:block;width:100%;height:clamp(220px,38vw,330px);object-fit:cover;}
#second #mainview div{z-index:2;width:100%;padding:0 20px;}
#second #mainview div h1{font-size:155%;line-height:1.5;letter-spacing:0.14em;}
#second #mainview div span{width:120px;margin-bottom:10px;font-size:85%;}
#second #mainview div span.sub{margin-top:10px;}

/* HOME */
.sec01 > .flex > .w50 + .w50{margin-top:40px;}
.sec01 .btn{margin-top:0;}
.sec02 > .flex > .w50 + .w50{margin-top:20px;}
.sec02 a.flex{display:block;}
.sec02 span.thum{display:block;width:100%;}
.sec02 span.copy{display:block;width:100%;padding:22px 42px 22px 20px;}
.sec02 span.copy dt{font-size:125%;}
.sec02 span.copy dd{font-size:95%;line-height:180%;}
.sec03 > .flex{display:block;}
.sec03 .left,.sec03 .right{width:100%;}
.sec03 .left .btn a{width:100%;margin:0;}
.sec03 .right{margin-top:35px;}
.sec03 .right li a{padding:25px 40px 25px 14px;line-height:170%;}
.sec03 .right li a::after{right:14px;}
.sec03 .right li span{display:block;width:auto;margin-bottom:5px;}

/* TABLE */
table,table tbody,table tr,table th,table td{display:block;width:100%;}
table th,table td{padding:16px 14px;}
.con_sec02 table td{padding:16px 0;}
table th{border-bottom:0;}
table td{border-top:0;}
table th span{margin-left:10px;float:none;}
table td textarea,table td input{font-size:110%;}
table td input.short{width:100%;}
table td dl{display:block;padding:5px 0;}
table td dl dt,table td dl dd{width:100%;}
table td dl dt{margin-bottom:7px;}

/* COMPANY */
.co_sec01 > .flex,.co_sec03 > .flex,.co_sec04 > .flex{display:block;}
.co_sec01 .w50:last-child,.co_sec03 .w50:last-child,.co_sec04 .w50:last-child{margin-top:30px;}
.co_sec02 .rinen{height:310px;width: calc(100% + 40px);margin: 0 -20px}
.co_sec02 .rinen p{padding-left:20px;font-size:92%;line-height:240%;text-shadow: 0 0 10px rgba(0,0,0,2),0 0 10px rgba(0,0,0,2),0 0 10px rgba(0,0,0,2)}
.co_sec05 td dl{display:block;}
.co_sec05 td dt,.co_sec05 td.reki dt{width:100%;margin-bottom:3px;font-weight:500;}
.co_sec05 th,
.co_sec05 td{width: 100%;;border: none;}
.co_sec05 th br{display: none;}
.co_sec05 td .flex{display:block;}
.co_sec05 td .flex li{width:100%;}
.co_sec06 > .flex{display:block;}
.co_sec06 .w31 + .w31{margin-top:30px;}
.co_sec06 iframe{height:240px;}
.co_sec07 th,.co_sec07 td{padding:14px 0;}
.co_sec07 table{border-top: solid 1px #ccc;}
.co_sec07 th{width:100%;padding-bottom:5px;border-bottom:0;padding: 14px 0 0;border: none}
.co_sec07 td{padding: 7px 0 14px}

/* JOINERY */
.jo_sec01 > .flex{display:block;}
.jo_sec01 .w33 + .w33{margin-top:20px;}
.jo_sec03 ol.flex{display:block;padding-top:10px;}
.jo_sec03 li{width:100%;margin-bottom:35px;padding:28px 18px 20px;}
.jo_sec03 li:last-child{margin-bottom:0;}
.jo_sec03 li:after{top:auto;right:50%;bottom:-4px;width:50px;height:50px;background-size:50px 50px;transform:translateX(50%) rotate(90deg);}
.jo_sec03 li dt{font-size:330%;}
.jo_sec03 li dd{font-size:135%;}
.jo_sec04 ul.flex{display:block;}
.jo_sec04 li{width:100%;margin-bottom:15px;}
.jo_sec04 li:last-child{margin-bottom:0;}
.jo_img02_wide{width:100%;margin:0;}
.jo_btns{padding: 25px}
.jo_btns li{margin:10px 0}
.jo_btns li:last-child a{margin: 0}
.jo_sec04 .mb50 li{width: 100%;padding:100px 0;text-align: center;}



/* KATARACK */
.riyu_area{padding:28px 20px;margin-top: 50px}
.riyu_area h3{font-size:130%;}
.riyu_area h3:after{height:55px;top:-28px;left:-9px;}
.riyu_area li{padding:22px 18px;}
.ka_sec01 > .flex{display:block;}
.ka_sec01 .w45{margin-top:30px;}
.ka_sec03 li{margin-bottom:25px;overflow:hidden;}
.ka_sec03 li .flex,.ka_sec03 li:nth-child(2) .flex{display:flex;flex-direction:column;}
.ka_sec03 .w55,.ka_sec03 .w45{width:100%;}
.ka_sec03 .riyu_area ul li{margin-bottom: 20px;}
.ka_sec03 .riyu_area ul li:last-child{margin:0}
.ka_sec03 .flex{display: block;}
.ka_sec03 .flex dl{padding:25px 20px 30px;}
.ka_sec03 li span{font-size:1200%;right: 0 !important;left:auto !important;}
.ka_sec03 .riyu_area ul li dl{padding:22px 18px;width: 100%;}
.ka_sec04 .flex{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;margin-bottom:0;}
.ka_sec04 .flex li{width:auto;margin:0;padding:18px 14px;}
.ka_sec04 .flex dl dt{font-size:105%;}
.ka_sec04 .flex dl dd{font-size:90%;}

/* OPTION */
.op_sec01 > .flex{display:block;}
.op_sec01 li{text-indent: 0;margin:0;}
.op_sec01 .w35{margin-top:30px;}
.chiki_tl{margin-bottom:35px;padding:10px 15px;font-size:125%;line-height:1.5;letter-spacing:0.12em;}
.btns .nishi a,.btns .higashi a{height:72px;}
.op1_sec01 ol.flex{display:block;padding-top:10px;}
.op1_sec01 ol li{width:100%;margin-bottom:35px;padding:28px 18px 20px;}
.op1_sec01 ol li:last-child{margin-bottom:0;}
.op1_sec01 ol li:after{top:auto;right:50%;bottom:-20px;width:50px;height:50px;background-size:50px 50px;transform:translateX(50%) rotate(90deg);}
.op1_sec01 ol li dt{font-size:330%;margin-top: -40px}
.op1_sec01 ol li dd{font-size:120%;}
.op1_sec01 .column{padding:22px 18px;}
.op1_sec01 .btn_area .big a{height:80px;font-size:120%;font-weight: bold;}
.op1_sec01 .btn_area .btns{display:block;}
.op1_sec01 .btn_area .btns li{width:100%;margin-top:15px;}
.op1_sec01 .btn_area .btns li a{height:68px;}
.op2_sec01 > .flex{display:block;}
.op2_sec01 > .flex .tl{margin-bottom:25px;}
.op2_sec01 > .flex .btn{margin-bottom:35px;}
.op3_sec01 .riyu_area dt{font-size:110%;}
.parent-nishi table th,.parent-nishi table td,.parent-higashi table th,.parent-higashi table td{width:100%;padding:16px 14px;border: none;}
.parent-nishi table td .flex,.parent-higashi table td .flex{display:flex;}
.parent-nishi table td ul,.parent-higashi table td ul{display:block;margin:0;}
.parent-nishi table td ul li,.parent-higashi table td ul li{display:grid;width:100%;grid-template-columns:72px minmax(0,1fr) 38px;align-items:center;gap:6px;padding:7px 0;}
.parent-nishi table td ul li input,.parent-higashi table td ul li input{width:100%;margin:0;}
.parent-nishi table td ul li select,.parent-higashi table td ul li select{width:100%;min-width:0;}
.parent-nishi table td ul li span,.parent-higashi table td ul li span{width:auto;}
.parent-nishi table td button.copy-address-btn,.parent-higashi table td button.copy-address-btn{width:100%;margin-bottom:15px;padding:10px;}
parent-nishi table td{border-bottom: none;}
.option-product__head{align-items:center;}
.option-product__buttons{flex:0 0 auto;}
.option-product__buttons button{margin-left:8px;}
.op2_sec01 select{max-width:100%;font-size:110%;}
.form-buttons{display:block;}
.form-buttons .form-btn{width:100%;height:54px;margin:0 0 14px;}
.form-buttons .form-btn input{padding:0 44px 0 14px;}
.form-buttons .form-btn span::after{right:16px;}

/* CONTACT */
.con_sec01 > .flex{display:block;}
.con_sec01 dl{min-height:170px;padding:25px 18px;}
.con_sec01 dl + dl{margin-top:20px;}
.con_sec01 dd strong{font-size:260%;letter-spacing:0;}

/* RECRUIT */
.re_sec01 > .flex{display:block;}
.re_sec01 .w50:last-child{margin-top:30px;}
.re_sec01 iframe{width:100%;height:auto;aspect-ratio:16 / 9;}
.re_sec02 > .flex{display:block;}
.re_sec02 .honsha,.re_sec02 .kojo{width:100%;padding:18px 14px ;}
.re_sec02 .kojo{margin-top:20px;}
.re_sec02 ul{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;}
.re_sec02 li,.re_sec02 .honsha li,.re_sec02 .kojo li{width:100%;min-height:115px;padding:14px 8px;font-size:100%;}
.re_sec02 .kojo ul{display:block;}
.re_sec02 .scroll{overflow: scroll;}
.re_sec02 .scroll p{width: 600px;}
.re_sec02 h3{margin-bottom: 15px}
.re_sec03 ol.flex{display:block;}
.re_sec03 li{width:100%;margin-bottom:65px;}
.re_sec03 li:last-child{margin-bottom:0;}
.re_sec03 li:after{top:auto;right:50%;bottom:-50px;transform:translateX(50%) rotate(90deg);}
.re_sec04 ul.flex{display:block;}
.re_sec04 li + li{margin-top:15px;}
.re_sec05 ul{grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;}
.re_sec05 li:nth-child(n){grid-column:auto;}
.re_sec06{padding:35px 20px;margin-bottom:60px;}
.re_sec06 h2{font-size:135%;line-height:1.55;letter-spacing:0.15em;}
.re_sec06 .copy{margin-bottom:30px;}
.re_sec06 .btn a{width:100%;height:76px;font-size:115%;letter-spacing:0.12em;}
.re_sec02 .scroll-wrap{position:relative;width:100%;width: calc(100% + 40px);margin: 0 -20px}
.re_sec02 .scroll{width:100%;overflow-x:auto;overflow-y:hidden;-webkit-overflow-scrolling:touch;scrollbar-width:none;}
.re_sec02 .scroll::-webkit-scrollbar{display:none;}
.re_sec02 .scroll p{width:max-content;margin:0;}
.re_sec02 .scroll img{display:block;width:800px;max-width:none;height:auto;}
.re_sec02 .scroll-guide{display:flex;align-items:center;justify-content:center;gap:10px;margin:12px 0 0;color:#666;font-size:13px;line-height:1.5;letter-spacing:0.05em;}
.re_sec02 .scroll-guide::after{content:"→";display:block;color:#000;font-size:18px;line-height:1;animation:scroll-guide-arrow 1.4s ease-in-out infinite;}
@keyframes scroll-guide-arrow{0%,100%{transform:translateX(0);opacity:0.4;}50%{transform:translateX(8px);opacity:1;}}

/* REFORM */
.ref_sec01 > .flex,.ref_sec02 > .flex{display:block;}
.ref_sec01 .w50:last-child,.ref_sec02 .w50:last-child{margin-top:30px;}
.ref_sec03 .bk_img{min-height:0;margin-top:30px;padding:25px 18px;background-position:center;}
.ref_sec03 .bk_img ul{width:100%;padding:22px 18px;background:rgba(255,255,255,0.9);}
.ref_sec04 .bk_img ul{grid-template-columns:1fr;gap:20px;}
.ref_sec04 .bk_img dl{min-height:0;padding:20px 65px 24px 18px;}
.ref_sec04 .bk_img dl::after{font-size:350%;}
.ref_sec05 ul.flex{display:block;}
.ref_sec05 .dami{width:100%;margin-bottom:15px;}
.ref_sec05 .dami:last-child{margin-bottom:0;}

/* PRIVACY */
.privacy_area li,.privacy_area p,.privacy_area dt,.privacy_area dd{line-height:190%;}

/* NEWS */
.news .left,.news #sidebar{width:100%;float:none;}
.news #sidebar{margin-top:50px;}
.blogsingle .entrybody{padding: 0 0 0 5%;}
.blogsingle .entrybody h2 a{padding:8px 0;font-size:125%;}
.blogsingle .entrybody .btn a{width:100%;}
.single.news .entrysingle h3{font-size:120%;line-height:1.6;}
.tablenav{margin:35px auto;}

/* FORM COMPLETE */
.form-complete h3{margin-bottom:22px;font-size:140%;line-height:1.6;letter-spacing:0.1em;}
.form-complete > p{margin-bottom:15px;line-height:180%;}
.complete-contact{margin:24px 0;padding:20px 15px;}
.form-complete .btn{margin-top:28px;}

/* ANIMATION */
.body-gradient-background{height:800px;;}
.gradient-object{will-change:auto;transform-style:flat;}
.gradient-object--left{top:3%;left:-61%;width:142vw;filter:blur(7px);}
.gradient-object--left::before{filter:blur(16px);}
.gradient-object__purple,.gradient-object__green{filter:blur(22px);}
.gradient-object--right{top:4%;right:-52%;width:107vw;filter:blur(7px);}
.gradient-object--right::before{filter:blur(16px);}
.asset-piece{transform:translate3d(0,0,0);filter:none!important;will-change:auto;}
.asset-piece:hover{filter:none!important;}
.asset-piece.is-dragging{filter:none!important;box-shadow:none!important;text-shadow:none!important;transition:none;will-change:left,top;}
.asset-piece.is-dragging img{filter:none!important;box-shadow:none!important;}
.asset-drop-slot{box-shadow:none;}