@charset "utf-8";
/* ------------------------------
   CSS Reset
   Default Style
   Frame
   Contents
   Responsive Style
   Common
------------------------------ */

/*==================================================================
   CSS Reset
==================================================================*/
*,*::before,*::after{box-sizing:border-box;}
html{margin:0;padding:0;font-size:100%;-webkit-text-size-adjust: 100%;}
body{margin:0;padding:0;overflow-wrap:break-word;}
h1,h2,h3,h4,h5,h6,p,blockquote,pre,hr,div,ul,ol,li,dl,dt,dd,fieldset,form,legend,figure{margin:0;padding:0;}
h1,h2,h3,h4,h5,h6{font-size:100%;font-weight:normal;}
ul,ol{list-style:none;}
fieldset{margin:0;padding:0;border:0 none;}
table{border-spacing:0;border-collapse:collapse;}
caption,th{text-align:left;}
caption,th,address{font-style:normal;font-weight:normal;}
img{max-width: 100%;height: auto;border:0 none;vertical-align:bottom;}
button,input,select,textarea{margin:0;padding:0;font: inherit;color: inherit;letter-spacing: inherit;vertical-align:middle;}
select{appearance: none;}
button,input[type="button"],input[type="submit"],input[type="reset"]{border:none;border-radius:0;}
textarea {resize:vertical;}
mark{font-weight:normal;font-style:normal;}
blockquote,q{quotes:none;}
a{vertical-align:baseline;text-decoration:none;}
[hidden] {display: none !important;}


/*==================================================================
   Default Style
==================================================================*/
html{font-size: calc(1000vw / 750);scrollbar-gutter: stable;/*メニュー展開時のがたつき対策*/}
body{color:#000;font-size:3rem;font-family: 'Noto Sans JP',"Helvetica Neue",Arial,"Hiragino Kaku Gothic ProN","Hiragino Sans",Meiryo,sans-serif;line-height:1.6;}
/* ページのスクロール固定（メニュー展開中／オープニング再生中） */
body:has(#header.nav-active),
body.is-opening {overflow: hidden;}
.view_sp{display:block;}
.view_pc{display:none;}

/*========== link ==========*/
a, button, input, textarea, select {-webkit-tap-highlight-color: transparent;}
a, a:visited{color:#7f7f7f;}
a:hover, a:active{color:var(--site-color-blue01);}

/*========== form ==========*/
input,select,textarea{width:100%;font-size:max(16px, 2rem);font-family:"Helvetica Neue",Arial,"Hiragino Kaku Gothic ProN","Hiragino Sans",Meiryo,sans-serif;}
input[type="submit"],input[type="button"],input[type="file"]{line-height:1;}
input[type="text"],input[type="search"],input[type="tel"],input[type="url"],input[type="email"],input[type="password"],input[type="number"],input[type="range"],input[type="color"],
input[type="datetime"],input[type="date"],input[type="month"],input[type="week"],input[type="time"],input[type="datetime-local"],
select,textarea{padding: 0.8em;/*background:var(--form-color);*/border:solid 1px #000000;}
input[type="radio"],input[type="checkbox"]{width:auto;vertical-align:text-bottom;}
input::placeholder,input::-webkit-input-placeholder{font-size:max(16px, 2rem);}
input[type="file"]{display:none;}

/*========== color setting ==========*/
:root {
  --site-color-blue01:#0597ff;
  --form-color:#eef1f2;
  --red-color :#ff4848;
}

/*==================================================================
   Frame
==================================================================*/
/*========== container ==========*/
#container {display: flex;flex-direction: column;min-height: 100vh;}

/*========== header ==========*/
#header {position: fixed; top: 0; left: 0; width: 100%; z-index: 1000;
 opacity: 1;transition: opacity 0.5s ease;}
#header.at-footer {opacity: 0; pointer-events: none;}
#header .header_inner {position: relative;display: flex; align-items: center; justify-content: space-between;
 max-width: 1000px; margin-inline: auto; padding:0 4rem 2rem 4rem; z-index: 1001;}
#header .header_logo > a{display: block;}
#header .header_logo > a > img{width:8.5rem;}

#header .header_navBtn {position: relative;width: 8rem;height: 8rem;padding: 0;background: #000;border:0.1rem solid #FFF;cursor: pointer; transition: transform 0.3s ease;}
#header .header_navBtn::before,
#header .header_navBtn::after {
 content: "";position: absolute;left: calc(50% - 1.25rem);width: 2.5rem;height: 0.3rem;
 background: #FFF;transition: transform 0.3s ease;}
#header .header_navBtn::before {top: calc(50% - 0.15rem - 0.6rem);}
#header .header_navBtn::after {top: calc(50% - 0.15rem + 0.6rem);}

#header .header_nav {position: absolute;top: 0;left: 0;width: 100%;background:#000;overflow: hidden;z-index: 1000;max-height: 0;transition: max-height 0.5s ease;}
#header .header_nav > ul.nav_primary {max-width:1000px;margin-inline: auto;padding:12rem 4rem 0;}
#header .header_nav > ul.nav_primary > li {opacity: 0;
 transform: translateY(-20px);
 transition: opacity 0.3s ease, transform 0.3s ease;}
#header .header_nav > ul.nav_primary > li > a {display: block; color: #FFF;font-size: 4rem;font-weight:bold;padding-block:2rem;padding-right:5rem;text-align:left;text-decoration: none;border-bottom: 1px solid #777777;
 background: url(../img/arrow_01.png) right 1rem center / 1.4rem auto no-repeat;
 transition: color 0.3s ease, background-position 0.3s ease;}
#header .header_nav > ul.nav_primary > li > a:hover {color: var(--site-color-blue01);background-position: right 0.5rem center;}

#header .header_nav > ul.nav_legal{max-width:1000px;margin-inline: auto;padding:5rem 4rem;display:flex;align-items: center;justify-content:center;gap: 10rem;}
#header .header_nav > ul.nav_legal > li > a{color:#FFF;font-size:2.6rem;font-weight:bold;}
#header .header_nav > ul.nav_legal > li > a:hover{color:var(--site-color-blue01);}


/*-- active --*/
#header.nav-active .header_logo > a > img{filter:brightness(0) invert(1) !important;}
#header.nav-active .header_navBtn::before {top: calc(50% - 0.25rem);transform: rotate(45deg);}
#header.nav-active .header_navBtn::after {top: calc(50% - 0.25rem);transform: rotate(-45deg);}
#header.nav-active .header_nav {max-height: min(1000px, 100dvh);}
#header.nav-active .header_nav > ul.nav_primary > li {opacity: 1;transform: translateY(0);transition-delay: calc(var(--i) * 0.05s);}


/*---------- theme ----------*/
#header.is-dark img {filter: brightness(0) invert(1);}


/*========== main ==========*/
#main{flex:1;}
#main .page_hero{display: grid;place-content: center;height:80rem;background:#F9F9F9 url(../img/bg_hero_light01_sp.png) center top / 75rem no-repeat;}
#main .page_hero > .page_ttl{display: grid;gap: 5.5rem;text-align:center;font-family:"Roboto";}
#main .page_hero > .page_ttl > .en{font-size:11rem;font-weight:bold;color:#000;line-height:1;}
#main .page_hero > .page_ttl > .ja{font-size:4rem;font-weight:bold;line-height:1;}

#main .main_contents{min-height:80vh;padding: 8rem 0;}

/*---------- theme ----------*/
#main .page_hero[data-theme="dark"] {background-color: #151515;background-image:url(../img/bg_hero_dark01_sp.jpg);}
#main .page_hero[data-theme="dark"] > .page_ttl > .en {color:#FFF;}
#main .page_hero[data-theme="dark"] > .page_ttl > .ja {color:#FFF;}


/*========== footer ==========*/
#footer{background:#000;color:#FFF;}
#footer .footer_inner{max-width:1000px;margin-inline: auto;padding: 8rem 4rem 10rem;}
#footer .footer_logo{width:34.6rem;margin-bottom:6rem;}
#footer .footer_address{font-size:3rem;}
#footer .footer_nav{margin-block:9rem;padding-block: 9rem;border:0.2rem solid #474747;border-width:0.2rem 0;}
#footer .footer_nav  > ul.nav_primary,
#footer .footer_meta > ul.nav_legal{display:flex;flex-wrap: wrap;flex-direction: column;gap:5rem;}
#footer .footer_nav  > ul.nav_primary > li > a,
#footer .footer_meta > ul.nav_legal > li > a{display:block;color:#FFF;font-size:3rem;font-weight:bold;transition: color 0.3s ease;}
#footer .footer_nav  > ul.nav_primary > li > a:hover,
#footer .footer_meta > ul.nav_legal > li > a:hover{color:var(--site-color-blue01);}
#footer .footer_meta{display:flex;flex-direction: column;}
#footer .footer_meta .copyright{color:#767676;text-align:center;margin-top:10rem;}


/*==================================================================
   Contents
==================================================================*/
/*========== section ==========*/
/*-- title --*/
.sec_ttl{margin-bottom:6rem;font-weight:bold;line-height: 1;}
.sec_ttl > .en{display:block;font-size:10.5rem;font-family:"Roboto", sans-serif;text-align:left;margin-bottom:4rem;}
.sec_ttl > .ja{display:block;font-size:4rem;}
.sec_ttl:is(h3){padding-top:10rem;}
/*-- detail --*/
.sec_detail{display:flex;gap:8rem;flex-direction:column;}
.sec_detail > p{line-height:2;}
.sec_detail > p.btn01 > a{margin:0 auto !important;}
/*-- detail 1column --*/
.sec_detail.is-1col{display:block;}

/*========== title ==========*/
.ttl01{color: #000;font-size: 1.5em;font-weight:bold;text-align: left;padding: 0.5em 1em;background: #EEE;border-left: 0.5em solid var(--site-color-blue01);margin-bottom:1.5em;}


/*========== button ==========*/
/*-- btn01 (black) --*/
.btn01 a,
.btn01 button,
.btn01 input[type="submit"],
.btn01 input[type="file"] + label,
.btn01.jsbtn > span{display:block;width:80%;color:#FFF;font-size:3rem;font-weight:400;text-align:center;line-height: 1;margin:1.5em auto;padding:2em 3em;border:1px solid #FFF;background:#000 url(../img/arrow_01.png) right 4rem center / 2rem auto no-repeat;cursor: pointer;transition:background 0.3s ease;}


/*========== list ==========*/
ul.list_disc{list-style-type: disc;margin-left:1.5em;}

/*--- list_number ---*/
ul.list_num01,
ol.list_num01{list-style-type:decimal;margin-left:1.5em;}
ul.list_num02,
ol.list_num02{list-style: none;counter-reset: item;padding-left: 0;}
ul.list_num02 > li,
ol.list_num02 > li{position: relative;counter-increment: item;padding-left: 2.5em;}
ul.list_num02 > li::before,
ol.list_num02 > li::before{position: absolute;left: 0;top: 0;width: 2em;text-align: right;
 content: "(" counter(item) ")";}

/*--- list_item01 ---*/
dl.list_item01{text-align: left;margin-bottom:3em;}
dl.list_item01 dt{font-size: 1.2em;font-weight:bold;margin:1.5em 0 0.5em;}
dl.list_item01 dt:first-child{margin-top:0;}
dl.list_item01 dd{margin-bottom:0.5em;text-align: justify;}
dl.list_item01 dd > ul > li,
dl.list_item01 dd > ol > li{margin:0.5em 0;}

/*--- list_input ---*/
dl.list_input{text-align: left;margin-bottom:3em;}
dl.list_input > dt{font-size:1.3em;font-weight:bold;margin:1.5em 0 0.5em;}
dl.list_input > dt span.required{display: inline-block;vertical-align:text-top; color:#FF0000;margin-left:0.5em;}
dl.list_input > dd{margin-bottom:0.5em;text-align: justify;}
dl.list_input > dd.pc_flex{display:flex;align-items: center;gap: 1em;flex-wrap: wrap;}
dl.list_input > dd.pc_flex label{margin-right:1em;}
dl.list_input > dd.pc_flex input{width:auto;}

/*--- list_radio ---*/
ul.list_radio{position: relative;}
ul.list_radio > li input[type="radio"]{position: absolute;opacity: 0;}
ul.list_radio > li input[type="radio"]:focus-visible + label {outline:0.2rem solid #000;outline-offset: 0.4rem;}
ul.list_radio > li input[type="radio"] + label{display:block;margin-bottom:1em;padding-left:2em;position:relative;}
ul.list_radio > li input[type="radio"] + label:after {content: "\f111";font-family: "Font Awesome 6 Free";font-weight: 500;position:absolute;left:0;top:50%;transform: translateY(-50%);}
ul.list_radio > li input[type="radio"]:checked + label:after {content: "\f192";color:var(--site-color-blue01);}

/*========== other ==========*/
/*--- inner ---*/
.cont_inner01{max-width:1000px;margin-inline: auto;padding: 0 4rem;}


/*========== animation ==========*/
/*-- animated_ttlView --*/
.animated_ttlView {text-align: center;}
.animated_ttlView > span {display: inline-block;vertical-align: text-bottom;  overflow: hidden;}
.animated_ttlView > span::before {content: attr(data-text);display: inline-block;transform: translateY(100%);}
/* 可視領域に入ったら（.is-inview付与で）アニメーション開始 */
.animated_ttlView.is-inview > span::before {
 animation: maskSlide 0.7s cubic-bezier(.77,0,.18,1) forwards;
 animation-delay: inherit; /* JSで設定したdelayを引き継ぐ */
}
/* 視差効果を減らす設定時はアニメーションなしで即表示 */
@media (prefers-reduced-motion: reduce) {
.animated_ttlView > span::before {transform: none;animation: none;}
}
@keyframes maskSlide {
  to {
    transform: translateY(0);
  }
}

/*==================================================================
   Responsive Style 
==================================================================*/
/*========== 750px以上 ==========*/
@media screen and (min-width:750px) { /* 750px以上 */
html{font-size: 62.5%;}
body{font-size:16px;}
input,select,textarea{font-size:2rem;}

.view_sp{display:none;}
.view_pc{display:block;}

/*---------- header ----------*/
#header .header_nav > ul.nav_primary > li > a {font-size: 3.2rem;}
#header .header_nav > ul.nav_legal{justify-content: flex-start;}
#header .header_nav > ul.nav_legal > li > a{font-size:2rem;}

/*---------- main ----------*/
#main .page_hero{height:60rem;background-image:url(../img/bg_hero_light01_pc.png);background-size:192rem 60rem;}
#main .page_hero > .page_ttl{gap: 6rem;}
#main .page_hero > .page_ttl > .ja{font-size:3rem;}

/*-- theme --*/
#main .page_hero[data-theme="dark"] {background-image:url(../img/bg_hero_dark01_pc.jpg);}

/*---------- footer ----------*/
#footer .footer_inner{padding-bottom:15rem;}
#footer .footer_address{font-size:1.6rem;}

#footer .footer_nav{margin-block: 9rem 6rem;padding-block: 6rem;}
#footer .footer_nav > ul.nav_primary{align-items: center;flex-direction: row;}
#footer .footer_nav > ul.nav_primary > li{width:calc(25% - 5rem);}
#footer .footer_nav > ul.nav_primary > li > a{font-size:1.6rem;}
#footer .footer_meta{align-items: center;flex-direction: row;justify-content: space-between;}
#footer .footer_meta > ul.nav_legal{width:50%;align-items: center;flex-direction: row;}
#footer .footer_meta > ul.nav_legal > li:first-child{width:calc(50% - 5rem);}
#footer .footer_meta > ul.nav_legal > li > a{font-size:1.6rem;}
#footer .footer_meta .copyright{width:50%;font-size:1.9rem;text-align:right;margin-top:0;}

/*---------- section ----------*/
.sec_ttl > .ja{font-size:3rem;}

.sec_detail{gap:2rem;flex-direction:row;justify-content:space-between;align-items:center;}
.sec_detail > p.text{width:calc(100% - 230px - 2rem)}
.sec_detail > p.btn01{width:230px;}
.sec_detail > p.btn01 > a{width: 100%;font-size: 1.6rem;padding: 2.5rem 4rem 2.5rem 2.5rem;
background-position:right 3rem center;
background-size:auto 0.85em;}
.sec_detail > p.btn01 > a:hover{background-position:right 2rem center;}

/*---------- button ----------*/
/*--- btn01 ---*/
.btn01 a,
.btn01 button,
.btn01 input[type="submit"],
.btn01 input[type="file"] + label,
.btn01.jsbtn > span{font-size:1.4rem;max-width:380px;
background-position: right 3rem center;
background-size:0.95rem auto;}
.btn01 a:hover,
.btn01 button:hover,
.btn01 input[type="submit"]:hover,
.btn01 input[type="file"] + label:hover{background-color:var(--site-color-blue01);background-position: right 1.5rem center;}

/*---------- list ----------*/
/*--- list_input ---*/
dl.list_input{margin-bottom:6.25em;}
dl.list_input > dt{font-size:1.6em;margin:2.5em 0 1.5em;}
/*--- list_radio ---*/
ul.list_radio{font-size:2rem;}

/**/} /* 750px以上 End */

/*========== 750px以上 and ブラウザの高さが狭い場合（ヘッダーメニュー調整） ==========*/
@media screen and (min-width: 750px) and (max-height: 880px),
       screen and (min-width: 650px) and (max-width: 749px){ /*650px以上750px未満のSPレイアウトにも同じ指示を適用*/
#header .header_nav > ul.nav_primary > li > a {font-size: 2.5rem; padding-block: 1.8rem;}
#header .header_nav > ul.nav_legal {padding-block: 4rem;}
#header .header_nav > ul.nav_legal > li > a {font-size: 1.8rem;}
/**/}/*高さ880px以下 End*/

@media screen and (min-width: 750px) and (max-height: 780px) {
#header .header_nav > ul.nav_primary {padding-top: 10rem;}
#header .header_nav > ul.nav_primary > li > a {font-size: 2rem; padding-block: 1.5rem;}
#header .header_nav > ul.nav_legal {padding-block: 3rem;}
#header .header_nav > ul.nav_legal > li > a {font-size: 1.6rem;}
/**/}/*高さ700px以下 End*/

@media screen and (min-width: 750px) and (max-height: 630px) {
#header .header_nav > ul.nav_primary > li > a {font-size: 1.4rem; padding-block: 1.2rem;}
#header .header_nav > ul.nav_legal {padding-block: 2rem; gap: 5rem;}
#header .header_nav > ul.nav_legal > li > a {font-size: 1.2rem;}
/**/}/*高さ550px以下 End*/

/*========== 1000px以上 PC Only ==========*/
@media screen and (min-width:1000px) { /* 1000px以上 */

/*---------- header ----------*/
#header .header_navBtn:hover {transform: scale(1.1);}

/*---------- footer ----------*/
#footer .footer_nav > ul.nav_primary > li > a{font-size:2rem;}
#footer .footer_meta > ul.nav_legal > li > a{font-size:2rem;}

/**/} /* 1000px以上 End */

/*==================================================================
   Common
==================================================================*/
.mt_S{margin-top:0.5em !important;}
.mt_M{margin-top:1em !important;}
.mt_L{margin-top:1.5em !important;}
.mb_S{margin-bottom:0.5em !important;}
.mb_M{margin-bottom:1em !important;}
.mb_L{margin-bottom:1.5em !important;}
.mb_0{margin-bottom:0 !important;}

.pt_S{padding-top:0.5em !important;}
.pt_M{padding-top:1em !important;}
.pt_L{padding-top:1.5em !important;}
.pb_S{padding-bottom:0.5em !important;}
.pb_M{padding-bottom:1em !important;}
.pb_L{padding-bottom:1.5em !important;}
.pb_0{padding-bottom:0 !important;}

.f_SS{font-size:0.5em!important;}
.f_S{font-size:0.8em!important;}
.f_M{font-size:0.9em!important;}
.f_L{font-size:1.2em!important;}
.f_LL{font-size:1.4em!important;}

/* font-color */
.fc_blu{color:var(--site-color-blue01) !important;}
.fc_red{color:#FF0000 !important;}
.fc_yel{color:#ffde00 !important;}
.fc_wht{color:#FFFFFF !important;}

/* font-weight */
.fw_bold{font-weight:bold !important;}
.fw_300{font-weight:300 !important;}
.fw_400{font-weight:400 !important;}
.fw_500{font-weight:500 !important;}
.fw_700{font-weight:700 !important;}
.fw_900{font-weight:900 !important;}

/* text-align */
.tx_left{text-align:left !important;}
.tx_center{text-align:center !important;}
.tx_right{text-align:right !important;}