@charset "utf-8";

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

	グローバル

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

body { font-size: 0.9em;}

.ta_right-s_center { text-align: center;}
.ta_left-s_center { text-align: center;}
.ta_center-s_left { text-align: left;}

.hidden_s { display: none !important;}

.mb40-20 { margin-bottom: 20px !important;}
.mb60-30, .mb50-30 { margin-bottom: 30px !important;}
.mb80-40 { margin-bottom: 40px !important;}
.mb100-60 { margin-bottom: 60px !important;}
.mb120-60 { margin-bottom: 60px !important;}
.mb120-80 { margin-bottom: 80px !important;}

.mt40-20 { margin-top: 20px !important;}

/* ------------------------
	ヘッダー
------------------------ */

.header { gap: 1em;}
.header .lang.mb05 { margin-bottom: 0px !important; flex-flow: column; gap: 0; line-height: 1.4; padding-right: 50px;}
a[data-gt-lang="zh-CN"]::after { font-size: 0.8rem;}


/* ------------------------
	フッター
------------------------ */

.footer .cta_box .box_inner { font-size: min(2.6vw,1em); padding: 1.5em 1.5em 2.5em;}
.footer .cta_box .btn_area a { max-width: 450px; padding: 1.5em 1em;}

.footer .rec_box { background-position: calc(50% - 8%) 20%; background-size: auto 95%, 100% 100%; padding: 17% 10% 20%;}
.footer .rec_box h2.mb50-30 { margin-bottom: 0.8em !important;}

.footer .main { justify-content: center; font-size: 1em;}
.footer .footer_nav { margin-bottom: 40px;}
.footer_nav, .footer .main .btn_area { font-size: min(2.5vw,0.95em) !important;}

.footer .logo { padding-right: 15%;}

.footer .copy { padding: 0.5em;}

.pagetop { right: 15px; padding-bottom: 40px;}

@media only screen and (max-width: 690px) {
  .footer .main .btn_area { font-size: 0.95em !important;}
  .footer .main .btn_area { flex-flow: row; justify-content: center; align-items: center; flex-wrap: wrap; gap: 2em; width: 100%;}
  .footer .main .btn_area li:nth-child(1) a { min-width: 14.5em;}
}

@media only screen and (max-width: 480px) {
  .footer .footer_nav { width: 100%; justify-content: space-between; gap: 2em; font-size: min(3vw,0.95em) !important;}
}


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

	トップページ

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

.loading .fo_white { font-size: min(4vw,1.5em);}
.loading .text01 { font-size: 1.5em;}
.loading .show_sp { display: inline;}

.heading_star { font-size: 2.3em;}

.mainimage:after { background-image: url("../images/top/movie_bg_sp.png"); background-image: image-set(url("../images/top/movie_bg_sp.webp") 1x, url("../images/top/movie_bg_sp@2x.webp") 2x);}
.mainimage .text01 { font-size: min(5.5vw,1.85em); bottom: 15%;}
.mainimage .scroll { width: 7px;}

.top_sec01 .heading_star { padding-left: 0; margin-left: 0;}
.top_sec01 .heading_star:before { display: none;}

@media only screen and (max-width: 640px) {
  .top_sec03 .box01 { flex-flow: column; gap: 16px;}
  .top_sec03 .box_inner { max-width: 400px; width: 100%; margin: auto;}
  .top_sec03 .list01 { font-size: 1em;}
  .top_sec03 .box01 > figure { width: auto; margin: 0;}
}

@media only screen and (max-width: 480px) {
  .top_sec01 .text01 { width: 80px; right: 0px; top: -50px;}

  .top_sec04 .archive_list > li:nth-child(4) { display: block;}
}

@media only screen and (max-width: 400px) {
  .top_sec01 .hide_sp { display: none;}
}


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

	下層ページ

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

.pagettl { font-size: 2em;}

/* ------------------------
	contact
------------------------ */

.con_header { padding: 100px 6% 0;}
.con_nav { gap: 1.5em;}

.con_sec01 { flex-flow: column; gap: 30px; margin-top: -20px; padding: 0 25px;}
.con_sec01 figure { padding: 0 20%;}
.con_sec01 h2.fo20 { font-size: min(8vw,2em) !important;}

.con_sec02 { padding: 50px 0;}
.con_sec02 .bg01 { border-radius: 1.5em; padding: 50px 20px;}

.con_sec03 .list01 { font-size: clamp(2.5em,5.55vw,3em); justify-content: center;}

@media only screen and (max-width: 700px) {
  .con_sec03 .list02 { flex-flow: column; gap: 20px;}
}

@media only screen and (max-width: 480px) {
  .con_head_nav { padding-top: 20px;}
  .con_nav { flex-flow: column; gap: 0.3em;}
  .lang.contact { flex-flow: column; gap: 0;}
}

@media only screen and (max-width: 420px) {
  .con_sec02 .show_sp, .con_sec03 .show_sp { display: inline;}
}


/* ------------------------
	投稿
------------------------ */

.blog_bg { padding: 20px 10px 1px;}

.archive_cat { padding: 1em 1.5em 2em; font-size: 0.9em;}

.top_sec04.single { padding: 50px 0 90px;}

.blog_header { padding: 50px 0 70px; background-image: url("../images/blog/single_bg_sp.png");}
.blog_header .cont1000 { flex-flow: column; gap: 40px;}
.blog_header .box_inner { width: 100%;}
.blog_header .cont1000 > figure { width: 100%; margin: 0; aspect-ratio: auto;}
.blog_header h1 { font-size: 2em; margin: -0.3em 0.5em auto;}

/* 本文 */
.blog_content h1 { font-size: min(7vw,2em);}
.blog_content h2 { font-size: 1.6em;}
.blog_content h3 { font-size: 1.6em;}

.blog_content blockquote { padding: 2.5em;}
.blog_content blockquote:before, .blog_content blockquote:after { width: 1.1em; height: 1em; top: 1.6em;}
.blog_content blockquote:before { left: 1.2em;}
.blog_content blockquote:after { right: 1.2em;}
.blog_content blockquote cite { margin-bottom: -0.5em;}

.archive_list { gap: 40px 1.5em !important;}
.archive_list > li { width: calc((100% - 3em) / 3) !important;}

@media only screen and (max-width: 640px) {
  .blog_content .table_wrap { overflow-x: scroll;}
  .blog_content .table_wrap:before { content: "※横にスクロールしてご覧ください。"; font-size: 0.85em; margin-bottom: 0.7em;}
  .blog_content .table_wrap table { min-width: 640px;}
}

@media only screen and (max-width: 480px) {
  .blog_content h1 .show_sp { display: inline;}

  .archive_list > li { width: calc((100% - 1.5em) / 2) !important;}
}


/* ブロックエディタ用 */
.wp-block-columns.access_box01 .wp-block-column { margin-bottom: 40px;}

.map iframe { height: 250px;}


/* 追加パーツ */
.feature_box01 section { width: 100%;}
.feature_box01 .num { font-size: min(8vw,2.8em); margin-top: 0.7em;}
.feature_box01 dt.mb30 { font-size: min(5.5vw,1.9em); margin-bottom: 1em !important;}
.feature_box01 dt:before { content: ""; position: absolute; width: 0.55em; height: 1em; background: url("../images/common/star_blue.svg") no-repeat center center; background-size: 100% auto; left: -0.8em; bottom: -0.5em;}

.pro_wrap { gap: 40px;}
.pro_wrap h2 span { font-weight: 500; display: inline-block; vertical-align: middle; width: 100%; font-size: 0.8em;}
.pro_wrap h2 span:last-child { margin-top: -0.7em;}

.nav_btn { display: none; position: fixed; text-align: center; z-index: 999; width: 50px; height: 50px; background: url("../images/product/nav_btn.svg") no-repeat center center; background-size: 100% auto; right: 5px; top: 75px; border-radius: 50%; box-shadow: 0 0 1em #A2E2F4, 0 0.3em 0.3em rgba(0,0,0,0.25);}
.nav_btn.open { box-shadow: none; background-image: url("../images/product/nav_btn_o.svg");}
.pro_wrap nav.pro_sp_nav .ul_wrap { display: none; position: fixed; width: 100%; left: 0; top: 60px; background: #fff; z-index: 600; padding: 80px 15px 20px;}

.pro_sp_nav .backdrop { display: none; position: fixed; inset: 0; background: rgba(21,56,136,.2); z-index: 590;}

.pro_wrap .faq_dl dd:before { top: -0.6em;}

@media only screen and (max-width: 640px) {
  .feature_box01 section { flex-flow: column; gap: 0.5em;}
  .feature_box01 .num { margin: 0; position: relative; background: url("../images/common/star_blue.svg") no-repeat right center; background-size: 0.4em auto; padding-right: 0.6em; width: auto; margin-right: auto;}
  .feature_box01 dt:before { display: none;}

  .mes_sec01 .bg01 { width: 90%;}
}

@media only screen and (max-width: 480px) {
  .pro_wrap .voice_box h3 .show_sp { display: inline;}
}


/* history */
.his_sec01 { padding: 13% 0 10%;}
.his_sec01 h2 { font-size: min(8vw,2em);}
.his_sec01 .bg02 { width: 17%;}

.his_sec02 h2.fo19 { font-size: min(7vw,1.9em) !important;}
.his_sec02 .box01 { font-size: 1em; gap: 0 !important; align-items: flex-start !important;}
.his_sec02 .box01 section { width: 100% !important; margin: 0 !important; flex-flow: row !important; align-items: flex-start !important;}
.his_sec02 section:not(:last-of-type) { padding-bottom: 3em;}
.his_sec02 section:not(:last-of-type):after {  height: auto !important; right: auto !important; transform: rotate(0) !important; left: 3em !important; top: 6.5em !important; bottom: 0.5em !important;}
.his_sec02 .box01 .box_inner { padding-top: 1.5em;}
.his_sec02 .box01 .ta_right { text-align: left !important;}
.his_sec02 div.num { font-size: 1em !important; width: 6em !important; height: 6em !important; align-self: flex-start !important; position: relative;}
.his_sec02 div.num.large:after { content: ""; position: absolute; background: url("../images/history/his_star02.svg") no-repeat center center; background-size: 100% auto; width: 1.6em; height: 2em; top: -1.5em; right: -0.5em; transform: rotate(-20deg);}
.his_sec02 div.num > span { font-size: 1em !important;}
.his_sec02 .img_box.pos_ab { position: static !important; text-align: left !important; margin: 15px 0 0 0 !important;}
.his_sec02 .pos_ab img { max-width: 100% !important; box-sizing: border-box;}
.his_sec02 .fo15 { font-size: min(6vw,1.5em) !important;}

.his_sec02 div.num.large.sp_left:after { right: auto; left: 0.3em; transform: rotate(40deg) scale(-1,1); top: -2.2em;}
.his_sec02 .sec08 .bg01 { top: 6em; right: auto; left: 6em; width: 1.7em;}
.his_sec02 .box_inner .hide_sp { display: none;}
.his_sec02 .sec10 .pos_ab { position: static; margin-top: 15px;}

.his_sec02 .sec16 { align-self: flex-end; font-size: min(3vw,1em) !important;}
.his_sec02 .sec16 div.num { font-size: 1.3rem !important; width: 5em !important; height: 5em !important; margin-left: -0.3em;}
.his_sec02 .sec16 .box_inner { margin: -1.5em -1em 0 0;}
.his_sec02 .sec16 .bg01 { width: 1.8em; top: 0; left: 22em;}
.his_sec02 .sec16 .bg02 { width: 1.8em; bottom: -4em; right: auto; left: 21em; transform: rotate(60deg);}
.his_sec02 .sec16 .bg03 { width: 35%; top: 7rem; left: 3.5rem;}

.his_bnr .list01 { flex-wrap: wrap; justify-content: center; gap: 30px 5%; padding-top: 30px;}
.his_bnr .list01 li { width: 23em;}
.his_bnr .list01 a { font-size: 1.3em; padding: 1em 3em 1em 3em;}

.translated-ltr .his_sec02 section .box_inner { max-width: initial;}

@media only screen and (max-width: 640px) {
  .his_sec02 .sec16 { padding-bottom: 15%;}
}


/* flow */
.flow_sec01 .main { max-width: 360px; font-size: min(3.3vw,0.9em);}
.flow_sec01 .main .img_text01, .flow_sec01 .main .img_text02 { top: 0.5em; width: 8em; height: 8em; line-height: 1.5;}
.flow_sec01 .main .img_text01 { left: 0.1em;}
.flow_sec01 .main .img_text02 { right: 0;}
.flow_sec01 .main .img_text03 { left: calc(50% - 11.2em);}
.flow_sec01 .main .img_text04 { right: calc(50% - 11.5em);}

.flow_sec01 .mb160-80 { margin-bottom: 120px !important;}
.flow_sec01.cont1200 { padding: 0 15px;}
.flow_sec01 .box01 { background-image: url("../images/flow/flow_sec01_bg_sp.jpg"); background-size: cover;  padding: 0 1.5em 3em; margin: 0 -15px; font-size: min(3.7vw,1.4em); line-height: 1.5;}
.flow_sec01 .box01 h2 { font-size: min(6.2vw,1.8em);  padding: 0.5em 1.8em; border-radius: 3em;}
.flow_sec01 .box02 { flex-flow: column; gap: 2em; margin-top: -40px;}
.flow_sec01 .large { font-size: 1.1em;}

.flow_sec01 section { display: flex; align-items: center; justify-content: center; gap: 1em; margin: 0 !important; align-self: center !important;}
.flow_sec01 .sec03, .flow_sec01 .sec05, .flow_sec01 .sec03 { flex-flow: row-reverse;}
.flow_sec01 .sec02 { margin-top: -0.8em !important;}
.flow_sec01 .sec03 { margin: -1.3em 0 -1em -1.5em !important;}
.flow_sec01 .sec05 { margin-left: -2em !important;}
.flow_sec01 .sec06 { margin-right: -1em !important;}
.flow_sec01 .sec07 { margin-left: -1em !important;}
.flow_sec01 .sec09 { flex-flow: column-reverse;}

.flow_sec01 .box01 .pos_ab { position: static; margin: 0 !important;}
.flow_sec01 .sec02 .pos_ab { width: 4.5em;}
.flow_sec01 .sec03 .pos_ab { width: 4.5em;}
.flow_sec01 .sec04 .pos_ab { width: 3em;}
.flow_sec01 .sec05 .pos_ab { width: 4.5em;}
.flow_sec01 .sec08 .pos_ab { width: 5.5em;}
.flow_sec01 .sec09 .pos_ab { width: 5.5em; margin-right: -10em !important;}

.flow_sec01 .arrow { margin-top: -1.5em;}


.flow_sec02 { padding: 80px 0;}
.flow_sec02 .cont900 { gap: 130px;}

.flow_sec02 section { flex-flow: column !important; gap: 25px; padding: 50px 5% 25px; min-height: initial; margin: 0 0 0 1.5em !important;}
.flow_sec02 section:not(:last-of-type):after { height: 80px; left: 45%; bottom: -90px;}
.flow_sec02 section:nth-of-type(even):after { transform: translateX(-50%) scale(-1,1); left: 50%;}
.flow_sec02 h2 { font-size: min(5vw,1.55em); left: -1em !important; right: auto !important;}
.flow_sec02 h2:after { right: -24px;}
.flow_sec02 .img01 { padding:  0 20% !important;}