@charset "utf-8";

/* =================== reset =================== */

html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video{margin:0;padding:0;border:0;font-size:100%;font:inherit;vertical-align:baseline}article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{display:block}body{line-height:1}ol,ul{list-style:none}blockquote,q{quotes:none}blockquote:before,blockquote:after,q:before,q:after{content:'';content:none}table{border-collapse:collapse;border-spacing:0}

/* =================== base =================== */
/* font loading */
@font-face {
  font-family: 'jafont';
  src: url(../font/A-OTF-MidashiGoPr5-MB31.otf) format('opentype');
  font-weight: bold;
  font-display: swap;
}

:root {
  --main-color: #19738B;
  --base-color: #fff;
  --blue-color: #092C36;
  --orange-color: #EF8C44;
  --btn-color: #EF8C44;
  --text-color: #151C4A;
  --subtext-color: #4A4A4A;
  --border-color: #707070;
  --tag-bg: #F7F7F7;
  --en-font: "Heebo", Verdana;
  --ja-font: "Noto Sans JP", YuGothic, "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", Verdana, "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
  --midashi-font: "A-OTF 見出ゴMB31 Pro", Midashi Go MB31, "游ゴシック", YuGothic, "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", Verdana, "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
}

html { font-family: sans-serif; -ms-text-size-adjust: 100%; -webkit-text-size-adjust: 100%; }

html { margin: 0; overflow-x: hidden; font-size: 62.5%; box-sizing: border-box; }
body { font-size: 1.6rem; letter-spacing: normal; font-family: var(--ja-font); color: #fff; background: var(--base-color); overflow: hidden; }
*{ min-height: 0vw; line-height: 1.5em; box-sizing: border-box; color: var(--text-color); }
a{ text-decoration: none; cursor: pointer; transition: 0.3s; font-weight: 700; font-size: 1.4rem; }
img { vertical-align: bottom; width: 100%; height: auto; }
pre { width: 70%; margin: 1em auto; padding: 1em; border-radius: 5px; background: #25292f; color: var(--text-color); overflow-x: auto; /* ⭐ */ -webkit-overflow-scrolling: touch; /* ⭐ */ }
button{ background-color: transparent; border: none; cursor: pointer; outline: none; padding: 0; appearance: none; }
h1,h2,h3,h4,h5,h6{ font-weight: 700; line-height: 1.5em; font-family: var(--ja-font); }
li{ list-style: none; }
p{ font-family: var(--ja-font); font-weight: 400; line-height: 1.5em; }
select { -webkit-appearance: none; -moz-appearance: none; appearance: none; }
input,
button,
select,
textarea {  background: transparent; border: none; border-radius: 0; font: inherit; outline: none; }
textarea { resize: vertical; }

/*input[type='checkbox'],
input[type='radio'] { display: none; }*/

input[type='submit'],
input[type='button'],
input[type="date"],
label,
button,
select { cursor: pointer; }

select::-ms-expand { display: none; }

input{ text-align: left; margin-bottom: 10px; outline: none; padding: 10px 15px; width: 100%; background: #121212; border: 1px solid #fff; }
button{ margin-top: 35px; padding: 13px 15px; width: 100%; }

pre{ width: 100%; margin: 1em auto; padding: 1em; border-radius: 5px; background: #25292f; color: #fff; overflow-x: auto; -webkit-overflow-scrolling: touch; }
pre code{ display: block; color: #fff; width: 100%; font-size: 1.5rem; line-height: 1.5em; }

/* =================== common =================== */

/* flex */
.flex { display: -webkit-box; display: -ms-flexbox; display: flex; }

/* -ms-flex-direction */
.f_direction{ -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-direction: row; flex-direction: row; }
.f_row-reverse{-webkit-box-orient: horizontal;-webkit-box-direction: reverse;-ms-flex-direction: row-reverse;flex-direction: row-reverse; }
.f_column{ -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; }
.f_column-reverse{ -webkit-box-orient: vertical; -webkit-box-direction: reverse; -ms-flex-direction: column-reverse; flex-direction: column-reverse; }

/* flex-wrap */
.f_wrap{ -ms-flex-wrap: wrap; flex-wrap: wrap; }
.f_nowrap{ -ms-flex-wrap: nowrap; flex-wrap: nowrap; }
.f_wrap-reverse{ -ms-flex-wrap: wrap-reverse; flex-wrap: wrap-reverse; }
.f_row-wrap{ -webkit-box-orient:horizontal; -webkit-box-direction:normal; -ms-flex-flow:row wrap; flex-flow:row wrap; }

/* justify-content */
.f_jc-strat{ -webkit-box-pack: start; -ms-flex-pack: start; justify-content: flex-start; }
.f_jc-end{-webkit-box-pack: end;-ms-flex-pack: end;justify-content: flex-end; }
.f_jc-center{ -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; }
.f_jc-between{ -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; }
.f_jc-around{ -ms-flex-pack: distribute; justify-content: space-around; }

/* align-items */
.f_ai-stretch{ -webkit-box-align: stretch; -ms-flex-align: stretch; align-items: stretch; }
.f_ai-start{ -webkit-box-align: start; -ms-flex-align: start; align-items: flex-start; }
.f_ai-end{ -webkit-box-align: end; -ms-flex-align: end; align-items: flex-end; }
.f_ai-center{ -webkit-box-align: center; -ms-flex-align: center; align-items: center; }
.f_ai-baseline{ -webkit-box-align: baseline; -ms-flex-align: baseline; align-items: baseline; }

/* align-content */
.f_ac-stretch{ -ms-flex-line-pack: stretch; align-content: stretch; }
.f_ac-start{ -ms-flex-line-pack: start; align-content: flex-start; }
.f_ac-end{ -ms-flex-line-pack: end; align-content: flex-end; }
.f_ac-center{ -ms-flex-line-pack: center; align-content: center; }
.f_ac-between{ -ms-flex-line-pack: justify; align-content: space-between; }
.f_ac-around{ -ms-flex-line-pack: distribute; align-content: space-around; }

/* align-self */
.f_as-auto{ -ms-flex-item-align:auto; align-self:auto; }
.f_as-start{ -ms-flex-item-align: start; align-self: flex-start; }
.f_as-end{ -ms-flex-item-align: end; align-self: flex-end; }
.f_as-center{ -ms-flex-item-align: center; align-self: center; }
.f_as-baseline{ -ms-flex-item-align: baseline; align-self: baseline; }
.f_as-stretch{ -ms-flex-item-align: stretch; align-self: stretch; }

/* order */
.f_order1{ order:1; }
.f_order2{ order:2; }
.f_order3{ order:3; }
.f_order4{ order:4; }
.f_order5{ order:5; }
.f_order6{ order:6; }
.f_order7{ order:7; }
.f_order8{ order:8; }
.f_order9{ order:9; }
.f_order10{ order:10; }

/* flex-grow */
.f_grow1{ flex-grow:1; }
.f_grow2{ flex-grow:2; }
.f_grow3{ flex-grow:3; }
.f_grow4{ flex-grow:4; }
.f_grow5{ flex-grow:5; }
.f_grow6{ flex-grow:6; }
.f_grow7{ flex-grow:7; }
.f_grow8{ flex-grow:8; }
.f_grow9{ flex-grow:9; }
.f_grow10{ flex-grow:10; }

/* flex-shrink */
.f_shrink1{ -ms-flex-negative:1; flex-shrink:1; }
.f_shrink0{ -ms-flex-negative:0; flex-shrink:0; }


/* float */
.clear{ clear: both; }
.float-left{ float: left; }
.float-right{ float: right; }

.limg-rtext{ gap: 50px; }
.limg-rtext .img{ width: calc( 35% - 25px ); }
.limg-rtext .text{ width: calc( 65% - 25px ); }
.limg-rtext .text .title{ font-size: 2rem; margin-bottom: 25px; }

.rimg-ltext{ gap: 50px; }
.rimg-ltext .img{ width: calc( 35% - 25px ); }
.rimg-ltext .text{ width: calc( 65% - 25px ); }
.rimg-ltext .text .title{ font-size: 2rem; margin-bottom: 25px; }


@media screen and (max-width: 767px) {
  .limg-rtext .img,
  .limg-rtext .text{ width: 100%; }
  .rimg-ltext .img,
  .rimg-ltext .text{ width: 100%; }
}

.align-l{ text-align: left; }
.align-r{ text-align: right; }
.align-c{ text-align: center; }

.ver-t{ vertical-align: top; }
.ver-m{ vertical-align: middle; }
.ver-b{ vertical-align: bottom; }

.font10, .sub .contents .font10{ font-size:1rem; }
.font11, .sub .contents .font11{ font-size:1.1rem; }
.font12, .sub .contents .font12{ font-size:1.2rem; }
.font13, .sub .contents .font13{ font-size:1.3rem; }
.font14, .sub .contents .font14{ font-size:1.4rem; }
.font15, .sub .contents .font15{ font-size:1.5rem; }
.font16, .sub .contents .font16{ font-size:1.6rem; }
.font17, .sub .contents .font17{ font-size:1.7rem; }
.font18, .sub .contents .font18{ font-size:1.8rem; }
.font19, .sub .contents .font19{ font-size:1.9rem; }
.font20, .sub .contents .font20{ font-size:2rem; }
.font21, .sub .contents .font21{ font-size:2.1rem; }
.font22, .sub .contents .font22{ font-size:2.2rem; }
.font23, .sub .contents .font23{ font-size:2.3rem; }
.font24, .sub .contents .font24{ font-size:2.4rem; }
.font25, .sub .contents .font25{ font-size:2.5rem; }
.font26, .sub .contents .font26{ font-size:2.6rem; }
.font27, .sub .contents .font27{ font-size:2.7rem; }
.font28, .sub .contents .font28{ font-size:2.8rem; }
.font29, .sub .contents .font29{ font-size:2.9rem; }
.font30, .sub .contents .font30{ font-size:3rem; }
.font31, .sub .contents .font31{ font-size:3.1rem; }
.font32, .sub .contents .font32{ font-size:3.2rem; }
.font33, .sub .contents .font33{ font-size:3.3rem; }
.font34, .sub .contents .font34{ font-size:3.4rem; }
.font35, .sub .contents .font35{ font-size:3.5rem; }
.font36, .sub .contents .font36{ font-size:3.6rem; }
.font37, .sub .contents .font37{ font-size:3.7rem; }
.font38, .sub .contents .font38{ font-size:3.8rem; }
.font41, .sub .contents .font41{ font-size:4.1rem; }
.font42, .sub .contents .font42{ font-size:4.2rem; }
.font43, .sub .contents .font43{ font-size:4.3rem; }
.font44, .sub .contents .font44{ font-size:4.4rem; }
.font45, .sub .contents .font45{ font-size:4.5rem; }
.font46, .sub .contents .font46{ font-size:4.6rem; }
.font47, .sub .contents .font47{ font-size:4.7rem; }
.font50, .sub .contents .font50{ font-size:5rem; }
.font52, .sub .contents .font52{ font-size:5.2rem; }
.font53, .sub .contents .font53{ font-size:5.3rem; }
.font54, .sub .contents .font54{ font-size:5.4rem; }
.font56, .sub .contents .font56{ font-size:5.6rem; }
.font60, .sub .contents .font60{ font-size:6rem; }
.font65, .sub .contents .font65{ font-size:6.5rem; }
.font67, .sub .contents .font67{ font-size:6.7rem; }
.font80, .sub .contents .font80{ font-size:8rem; }
.font85, .sub .contents .font85{ font-size:8.5rem; }
.font100, .sub .contents .font100{ font-size:10rem; }



.w5{ width: 5%; }
.w10{ width: 10%; }
.w15{ width: 15%; }
.w20{ width: 20%; }
.w25{ width: 25%; }
.w30{ width: 30%; }
.w35{ width: 35%; }
.w40{ width: 40%; }
.w45{ width: 45%; }
.w50{ width: 50%; }
.w55{ width: 55%; }
.w60{ width: 60%; }
.w65{ width: 65%; }
.w70{ width: 70%; }
.w75{ width: 75%; }
.w80{ width: 80%; }
.w85{ width: 85%; }
.w90{ width: 90%; }
.w95{ width: 95%; }
.w100{ width: 100%; }

.ma5{ margin: 5px; }
.ma10{ margin: 10px; }
.ma15{ margin: 15px; }
.ma20{ margin: 20px; }
.ma25{ margin: 25px; }
.ma30{ margin: 30px; }
.ma35{ margin: 35px; }
.ma40{ margin: 40px; }
.ma45{ margin: 45px; }
.ma50{ margin: 50px; }
.ma55{ margin: 55px; }
.ma60{ margin: 60px; }
.ma65{ margin: 65px; }
.ma70{ margin: 70px; }
.ma75{ margin: 75px; }
.ma80{ margin: 80px; }
.ma85{ margin: 85px; }
.ma90{ margin: 90px; }
.ma95{ margin: 95px; }
.ma100{ margin: 100px; }

.mt5{ margin-top: 5px; }
.mt10{ margin-top: 10px; }
.mt15{ margin-top: 15px; }
.mt20{ margin-top: 20px; }
.mt25{ margin-top: 25px; }
.mt30{ margin-top: 30px; }
.mt35{ margin-top: 35px; }
.mt40{ margin-top: 40px; }
.mt45{ margin-top: 45px; }
.mt50{ margin-top: 50px; }
.mt55{ margin-top: 55px; }
.mt60{ margin-top: 60px; }
.mt65{ margin-top: 65px; }
.mt70{ margin-top: 70px; }
.mt75{ margin-top: 75px; }
.mt80{ margin-top: 80px; }
.mt85{ margin-top: 85px; }
.mt90{ margin-top: 90px; }
.mt95{ margin-top: 95px; }
.mt100{ margin-top: 100px; }

.mb5{ margin-bottom: 5px; }
.mb10{ margin-bottom: 10px; }
.mb15{ margin-bottom: 15px; }
.mb20{ margin-bottom: 20px; }
.mb25{ margin-bottom: 25px; }
.mb30{ margin-bottom: 30px; }
.mb35{ margin-bottom: 35px; }
.mb40{ margin-bottom: 40px; }
.mb45{ margin-bottom: 45px; }
.mb50{ margin-bottom: 50px; }
.mb55{ margin-bottom: 55px; }
.mb60{ margin-bottom: 60px; }
.mb65{ margin-bottom: 65px; }
.mb70{ margin-bottom: 70px; }
.mb75{ margin-bottom: 75px; }
.mb80{ margin-bottom: 80px; }
.mb85{ margin-bottom: 85px; }
.mb90{ margin-bottom: 90px; }
.mb95{ margin-bottom: 95px; }
.mb100{ margin-bottom: 100px; }

.ml5{ margin-left: 5px; }
.ml10{ margin-left: 10px; }
.ml15{ margin-left: 15px; }
.ml20{ margin-left: 20px; }
.ml25{ margin-left: 25px; }
.ml30{ margin-left: 30px; }
.ml35{ margin-left: 35px; }
.ml40{ margin-left: 40px; }
.ml45{ margin-left: 45px; }
.ml50{ margin-left: 50px; }
.ml55{ margin-left: 55px; }
.ml60{ margin-left: 60px; }
.ml65{ margin-left: 65px; }
.ml70{ margin-left: 70px; }
.ml75{ margin-left: 75px; }
.ml80{ margin-left: 80px; }
.ml85{ margin-left: 85px; }
.ml90{ margin-left: 90px; }
.ml95{ margin-left: 95px; }
.ml100{ margin-left: 100px; }

.mr5{ margin-right: 5px; }
.mr10{ margin-right: 10px; }
.mr15{ margin-right: 15px; }
.mr20{ margin-right: 20px; }
.mr25{ margin-right: 25px; }
.mr30{ margin-right: 30px; }
.mr35{ margin-right: 35px; }
.mr40{ margin-right: 40px; }
.mr45{ margin-right: 45px; }
.mr50{ margin-right: 50px; }
.mr55{ margin-right: 55px; }
.mr60{ margin-right: 60px; }
.mr65{ margin-right: 65px; }
.mr70{ margin-right: 70px; }
.mr75{ margin-right: 75px; }
.mr80{ margin-right: 80px; }
.mr85{ margin-right: 85px; }
.mr90{ margin-right: 90px; }
.mr95{ margin-right: 95px; }
.mr100{ margin-right: 100px; }

.pa5{ padding: 5px; }
.pa10{ padding: 10px; }
.pa15{ padding: 15px; }
.pa20{ padding: 20px; }
.pa25{ padding: 25px; }
.pa30{ padding: 30px; }
.pa35{ padding: 35px; }
.pa40{ padding: 40px; }
.pa45{ padding: 45px; }
.pa50{ padding: 50px; }
.pa55{ padding: 55px; }
.pa60{ padding: 60px; }
.pa65{ padding: 65px; }
.pa70{ padding: 70px; }
.pa75{ padding: 75px; }
.pa80{ padding: 80px; }
.pa85{ padding: 85px; }
.pa90{ padding: 90px; }
.pa95{ padding: 95px; }
.pa100{ padding: 100px; }

.pt5{ padding-top: 5px; }
.pt10{ padding-top: 10px; }
.pt15{ padding-top: 15px; }
.pt20{ padding-top: 20px; }
.pt25{ padding-top: 25px; }
.pt30{ padding-top: 30px; }
.pt35{ padding-top: 35px; }
.pt40{ padding-top: 40px; }
.pt45{ padding-top: 45px; }
.pt50{ padding-top: 50px; }
.pt55{ padding-top: 55px; }
.pt60{ padding-top: 60px; }
.pt65{ padding-top: 65px; }
.pt70{ padding-top: 70px; }
.pt75{ padding-top: 75px; }
.pt80{ padding-top: 80px; }
.pt85{ padding-top: 85px; }
.pt90{ padding-top: 90px; }
.pt95{ padding-top: 95px; }
.pt100{ padding-top: 100px; }

.pb5{ padding-bottom: 5px; }
.pb10{ padding-bottom: 10px; }
.pb15{ padding-bottom: 15px; }
.pb20{ padding-bottom: 20px; }
.pb25{ padding-bottom: 25px; }
.pb30{ padding-bottom: 30px; }
.pb35{ padding-bottom: 35px; }
.pb40{ padding-bottom: 40px; }
.pb45{ padding-bottom: 45px; }
.pb50{ padding-bottom: 50px; }
.pb55{ padding-bottom: 55px; }
.pb60{ padding-bottom: 60px; }
.pb65{ padding-bottom: 65px; }
.pb70{ padding-bottom: 70px; }
.pb75{ padding-bottom: 75px; }
.pb80{ padding-bottom: 80px; }
.pb85{ padding-bottom: 85px; }
.pb90{ padding-bottom: 90px; }
.pb95{ padding-bottom: 95px; }
.pb100{ padding-bottom: 100px; }

.pl5{ padding-left: 5px; }
.pl10{ padding-left: 10px; }
.pl15{ padding-left: 15px; }
.pl20{ padding-left: 20px; }
.pl25{ padding-left: 25px; }
.pl30{ padding-left: 30px; }
.pl35{ padding-left: 35px; }
.pl40{ padding-left: 40px; }
.pl45{ padding-left: 45px; }
.pl50{ padding-left: 50px; }
.pl55{ padding-left: 55px; }
.pl60{ padding-left: 60px; }
.pl65{ padding-left: 65px; }
.pl70{ padding-left: 70px; }
.pl75{ padding-left: 75px; }
.pl80{ padding-left: 80px; }
.pl85{ padding-left: 85px; }
.pl90{ padding-left: 90px; }
.pl95{ padding-left: 95px; }
.pl100{ padding-left: 100px; }

.pr5{ padding-right: 5px; }
.pr10{ padding-right: 10px; }
.pr15{ padding-right: 15px; }
.pr20{ padding-right: 20px; }
.pr25{ padding-right: 25px; }
.pr30{ padding-right: 30px; }
.pr35{ padding-right: 35px; }
.pr40{ padding-right: 40px; }
.pr45{ padding-right: 45px; }
.pr50{ padding-right: 50px; }
.pr55{ padding-right: 55px; }
.pr60{ padding-right: 60px; }
.pr65{ padding-right: 65px; }
.pr70{ padding-right: 70px; }
.pr75{ padding-right: 75px; }
.pr80{ padding-right: 80px; }
.pr85{ padding-right: 85px; }
.pr90{ padding-right: 90px; }
.pr95{ padding-right: 95px; }
.pr100{ padding-right: 100px; }


/* responsive */
.pc { display: block; }
.sp { display: none; }
.ipad { display: none; }


/* botton */
.btn{ background: var(--btn-color); position: relative; display: inline-block; overflow: hidden; max-width: 350px; width: 100%; padding: 20px; border-radius: 100px; font-weight:400; transition: all .3s; font-size: 2.5rem; text-align: center; color: #fff; }

.btn .text{ position: relative; z-index: 2; }
/*.btn:hover .text{ color: var(--btn-color); }*/

.btn .bg{ width: 100%; height: 100%; transition: all .3s; }
/*.btn .bg:before{ content: ""; position: absolute; left: 0; top: 0; background: var(--btn-color); width: 100%; height: 100%; transition: all .3s; }*/
/*.btn .bg:after{ content: ""; position: absolute; left: -102%; top: 0; background: #fff; width: 101%; height: 100%; transition: all .3s; border-radius: 100px; }*/
/*.btn:hover .bg:after{ left: 0; }*/

.arrow:after{ content: ""; position: absolute; transition: all .3s; right: 30px; top: 5px; bottom: 0; margin: auto; width: 7px; height: 7px; border-top: 2px solid #fff; border-right: 2px solid #fff; -webkit-transform: rotate(45deg); transform: rotate(45deg); }
.arrow:hover:after{ right: 30px; }

.btn.blank:after{ content: ""; position: absolute; transition: all .3s; left: 23px; top: 0; bottom: 0; margin: auto; width: 12px; height: 12px; background: url(../images/common/blank.svg) center/contain no-repeat; }
.btn.blank:hover:after{ background: url(../images/common/blank-pink.svg) center/contain no-repeat; }


.btn.cta-btn{ padding: 20px; font-size: 2rem; position: relative;  border-radius: 5px; }
.btn.cta-btn1{ border-color: var(--text-color); }
.btn.cta-btn2{ border-color: #fff; color: var(--text-color); }

/* text style */
.en{ font-family: var(--en-font)!important; }
.ja{ font-family: var(--ja-font); }
.midashi{ font-family: var(--midashi-font); }

.t_regular{ font-weight: 400; }
.t_medium{ font-weight: 500; }
.t_sem-bold{ font-weight: 600; }
.t_bold{ font-weight: 700; }
.t_extra-bold{ font-weight: 900; }

.t_black{ color: black; }
.t_white{ color: White; }
.t_red{ color: red; }
.t_blue{ color: blue; }
.t_maincolor{ color: var(--main-color); }
.t_textcolor{ color: var(--text-color); }
.t_subcolor{ color: var(--subtext-color); }
.t_goldcolor{ color: var(--gold-color); }

.t_underline{ text-decoration: underline; }

/* background */

.bg-white{ background: #fff; }
.bg-black{ background: #000; }
.bg-blue{ background: var(--blue-color); }

/* width */

.two-column,
.three-column,
.four-column,
.five-column{ flex: 1; gap: 50px; }

.two-column > *,
.three-column > *,
.four-column > *,
.five-column > *{ width: 100%; }

/* container */
.container{ max-width: 1180px; margin: 0 auto; padding: 0 50px; }

@media screen and (max-width: 767px) {
  .container{ padding: 0 15px; }
}

/* movie */

iframe{ max-width: 100%; }

.movie{ position: relative; width: 100%; padding-top: 56.25%; }
.movie *{ position: absolute; top: 0; right: 0; width: 100%; height: 100%; }


/* tab */

.tab-panel .tab-group{ width: 30%; }
.tab-panel .tab-group > *{ cursor: pointer; font-size: 1.7rem; color: #B7B7B7; }
.tab-panel .tab-group > *:not(:last-child){ margin-bottom: 10px; }
.tab-panel .tab-group > *.is-active{ transition: all 0.2s ease-out; color: var(--main-color); }
.tab-panel .panel-group{ width: 70%; }
.tab-panel .panel-group > *{ display: none; }
.tab-panel .panel-group > *.is-show{ display: block; }
.tab-panel .panel-group > * > p{ margin: 70px 0; }
.tab-panel .panel-group > *{ cursor: pointer; position: relative; }
.tab-panel .panel-group > *:not(:last-child){ border-bottom: 1px solid #EBEBEB; }
.tab-panel .panel-group > * a{ display: block; padding: 55px 0; }
.tab-panel .panel-group > * a .meta{ margin-bottom: 15px; gap: 0 15px; }
.tab-panel .panel-group > * a .meta span{ font-size: 1.7rem; }
.tab-panel .panel-group > * a .meta .date{ color: #B7B7B7; }
.tab-panel .panel-group > * a p{ font-size: 2.2rem; }
.tab-panel .panel-group > *.arrow:before{ content: ""; position: absolute; transition: all .3s; right: 18px; top: 0; bottom: 0; margin: auto; width: 13px; height: 13px; border-top: 1px solid var(--main-color); border-right: 1px solid var(--main-color); -webkit-transform: rotate(45deg); transform: rotate(45deg); }


/* accordion */

.accordion dl{ border-radius: 5px; background: #fff; }
.accordion dl:not(:last-child){ margin-bottom: 7px; }
.accordion dt{ padding: 25px 50px 25px 25px; position: relative; cursor: pointer; border-bottom: 1px solid #F5F5F5; }
.accordion dt:after,
.accordion dt:before{ content: ""; transition: 0.3s; position: absolute; height: 1px; width: 20px; background: var(--text-color); top: 0; bottom: 0; right: 25px; margin: auto; }
.accordion dt:before{ -webkit-transform: rotate(90deg); transform: rotate(90deg); }
.accordion dt.active:before{ -webkit-transform: rotate(-180deg); transform: rotate(-180deg); }
.accordion dt p{ font-size: 1.7rem; position: relative; cursor: pointer; display: table; }
.accordion dd{ display: none; position: relative; font-size: 1.7rem; padding: 25px 50px 25px 25px; margin: 0 }
/*.accordion dd:before{ content: ""; position: absolute; top: 0; left: 25px; width: calc( 100% - 50px); height: 1px; background: var(--border-color); }*/
.accordion dd p{ font-size: 1.6rem; position: relative; cursor: pointer; display: table; line-height: 1.7em; }
.accordion dd p a{  font-size: 1.6rem; }

/*.accordion.qa dt p:before,
.accordion.qa dd p:before{ content: "Q"; width: 50px; display: table-cell;  color: var(--gold-color); font-weight: 700; font-size: 2.4rem; }*/
/*.accordion.qa dd p:before{ content: "A"; color: var(--main-color); }*/
.accordion.qa dt p:before,
.accordion.qa dd p:before{ content: ""; background: url(../images/top/q-icon.svg) no-repeat; position: absolute; margin: auto; left: 0; bottom: 0; top: 0; width: 42px; height: 42px; z-index: 10; }
.accordion.qa dd p:before{ ontent: ""; background: url(../images/top/a-icon.svg) no-repeat; }
.accordion.qa dt p:before{ vertical-align: middle; }


/* post-list */

.post-list li{ display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; position: relative; height: auto; background: #fff; }
.post-list li a{ width: 100%; }
.post-list li .img-box{ overflow: hidden; position: relative; padding-top: 65%; }
.post-list li .img-box img{ transition: all .3s;height: 100%; position: absolute; top: 0; object-fit: cover; object-position: center; }
.post-list li .text-box{ padding: 45px; }
.post-list li .text-box .meta{ margin-bottom: 15px; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; gap: 5px 15px; }
.post-list li .text-box .meta span{ line-height: 1em; font-size: 1.4rem; }
.post-list li .text-box p{ overflow: hidden!important; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; font-size: 1.9rem; }
.post-list li.new:before{ content: "NEW"; box-sizing: border-box; position: absolute; right: 0; top: 0; color: #fff; width: 85px; padding: 5px; text-align: center; background: var(--main-color); z-index: 100; font-size: 1.3rem; font-family: var(--en-font); font-weight: 700; }
.post-list.flex{ gap: 45px; }
.post-list.flex li{ position: relative; width: calc( 100% / 2 - ( 27.5px ) ) ; }
.post-list.flex li .text-box{ padding: 30px 0 0; }


/* pagination */

.pagination{ margin-top: 90px; gap: 20px; }
.pagination li a,
.pagination li span{ display: inline-block; min-width: 15px; min-height: 26.5px; }
.pagination .nav-links a,
.pagination .nav-links span{ border-bottom: 2px solid transparent; font-size: 1.7rem; font-weight: 700; font-family: var(--en-font); text-align: center; }
.pagination .nav-links span{ color: var(--main-color); border-color: var(--main-color); }
.pagination .arrow a{ position: relative; }
.pagination .arrow a:before{ content: ""; position: absolute; transition: all .3s; right: 0; top: -4px; bottom: 0; margin: auto; width: 5px; height: 5px; border-top: 2px solid #000; border-right: 2px solid #000; -webkit-transform: rotate(45deg); transform: rotate(45deg); }
.pagination .arrow.prev a:before{ -webkit-transform: rotate(225deg); transform: rotate(225deg); }

.single-pagenation{ margin: 90px auto 0; max-width: 200px; padding-bottom: 20px; }
.single-pagenation .prev{ float: left; }
.single-pagenation .next{ float: right; }
.single-pagenation .prev a{ padding-left: 25px; }
.single-pagenation .next a{ padding-right: 25px; }
.single-pagenation div a{ position: relative; font-size: 1.4rem; }
.single-pagenation div a:before{ content: ""; position: absolute; transition: all .3s; right: 0; top: 0; bottom: 0; margin: auto; width: 5px; height: 5px; border-top: 2px solid #000; border-right: 2px solid #000; -webkit-transform: rotate(45deg); transform: rotate(45deg); }
.single-pagenation div.prev a:before{ -webkit-transform: rotate(225deg); transform: rotate(225deg); left: 0; right: auto; }


/* table */

.table-box table th,
.table-box table td{ padding: 20px; line-height: 1.8; font-size: 1.6rem; text-align: left; }

.table-box.all-border table{ border: 1px solid #e4e4e4; }
.table-box.all-border table th,
.table-box.all-border table td{ border-bottom: 1px solid #e4e4e4; }
.table-box.all-border table th{ border-right: 1px solid #e4e4e4; }
.table-box.all-border table tr:last-child th,
.table-box.all-border table tr:last-child td{ border-bottom: none; }

.table-box.odd-bg table tr:nth-child(odd) > *{ background: #e4e4e4; }
.table-box.even-bg table tr:nth-child(even) > *{ background: #e4e4e4; }

.table-box.bottom-border table th,
.table-box.bottom-border table td{ border-bottom: 1px solid #e4e4e4; }

.table-box.right-border table tr *{ border-right: 1px solid #e4e4e4; }

.table-box .noborder{ border: none!important; }

.udlr-center_box{ position: relative; }
.udlr-center{ position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); -webkit-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); }

@media screen and (max-width: 820px) {
  .accordion dt p{ font-size: 1.6rem; }
  .accordion dd p,
  .accordion dd p a{ font-size: 1.5rem; }
  .accordion dl:not(:last-child) { margin-bottom: 20px; }

  .accordion.qa dt p:before,
  .accordion.qa dd p:before { width: 30px; font-size: 2.2rem; }
}