/****reset
*****************************************/
html {
  font-size: 62.5%; }

html, body {
  width: 100%;
  height: auto; }

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,
figure, figcaption, footer, header, hgroup,
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
  margin: 0;
  padding: 0;
  border: 0;
  font-size: 100%;
  vertical-align: baseline; }

/* HTML5 display-role reset for older browsers */
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; }

a {
  -webkit-text-decoration: normal;
  text-decoration: normal;
  cursor: pointer; }

blockquote, q {
  quotes: none; }

blockquote:before, blockquote:after,
q:before, q:after {
  content: '';
  content: none; }

input, select {
  vertical-align: middle; }



html {
font-size: 62.5%;
}

@media only screen and (max-width: 1280px) {
html {
font-size: 50%;
  }
}
@media only screen and (max-width: 768px) {
html {
  font-size: calc(100vw / 100);
  }
}

@media only screen and (max-width: 540px) {
html {
  font-size: calc(100vw / 75);
  }
}

html, body {
  width: 100%;
  height: auto; }

body {
  color: #404040;
  font-family: "Noto Sans JP",Helvetica Neue,Arial,Hiragino Kaku Gothic ProN,Hiragino Sans,Meiryo,sans-serif;
  font-size: 16px;
  font-size: 1.6rem;
  font-weight: 500;
  line-height: 1.6;
  -webkit-text-size-adjust: 100%;
  background: #eeeeee;
  }
@media screen and (max-width: 768px) {
body {
}
}

* {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  -o-box-sizing: border-box;
  -ms-box-sizing: border-box;
  box-sizing: border-box; }

img {
width: 100%;
  max-width: 100%;
  height: auto; }

a {
  text-decoration: none;
  -webkit-transition: all 0.3s;
  -o-transition: all 0.3s;
  transition: all 0.3s; }

figure {
  line-height: 0; }

.center {
  text-align: center !important;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center; }

.left {
  text-align: left; }

.right {
  text-align: right; }

::-moz-selection {
    background: #b3d4fc;
    text-shadow: none;
}

::selection {
    background: #b3d4fc;
    text-shadow: none;
}

hr {
    display: block;
    height: 1px;
    border: 0;
    border-top: 1px solid #ccc;
    margin: 1em 0;
    padding: 0;
}

audio,
canvas,
iframe,
img,
svg,
video {
    vertical-align: middle;
}

fieldset {
    border: 0;
    margin: 0;
    padding: 0;
}

textarea {
    resize: vertical;
}

.browserupgrade {
    margin: 0.2em 0;
    background: #ccc;
    color: #000;
    padding: 0.2em 0;
}
.f_en{
font-family: "Lexend", sans-serif;
}
.f_jp_line{
font-family: "LINE Seed JP", sans-serif;
}

/* ==========================================================================
   Author's custom styles
   ========================================================================== */

body.fixed{
  position: fixed;
  width:100%;
}

#wrapper_all{
	position:relative;
    width: 100%;
/*    overflow: hidden;*/
}
#wrapper{
}



#l-header_wrap a,
.footer a,
#wrapper a img {
  opacity: 1;
-webkit-transition: opacity 0.2s ease-out;
-moz-transition: opacity 0.2s ease-out;
-ms-transition: opacity 0.2s ease-out;
transition: opacity 0.2s ease-out; }

#l-header_wrap a:hover,
.footer a:hover,
#wrapper a:hover img {
  opacity: .85; }
a.mover_btn{
  opacity: 1;
-webkit-transition: opacity 0.2s ease-out;
-moz-transition: opacity 0.2s ease-out;
-ms-transition: opacity 0.2s ease-out;
transition: opacity 0.2s ease-out;}
a.mover_btn:hover{
  opacity: .5 !important;
}

@media screen and (max-width: 768px) {
#wrapper{
}
}


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

.l-footer {
    width: 100%;
    padding:1rem 3rem 5rem;
    color: #000;
    background: #FFF;
    position: relative;
}
.l-footer .l-footer__inner {
    width:100%;
	max-width: 1080px;
    margin: 0 auto;
    padding: 0;
	position:relative;
}
.l-footer_wrap{
text-align: left;
}
.l-footer_copy{
font-size: 1.0rem;
margin: 3.0rem auto 0;
}
#page-top{
    height: 52px;
    width: 52px;
    position: fixed;
    right: 20px;
    bottom: 120px;
    z-index: 102;
    transition: all 0s;
    /*transition: all .2s;*/
}
.pagetop__arrow {
}
#page-top {
}
#page-top:hover {
}
.btn_pagetop_wrap{
    position: fixed;
	width:30px;
	height:150px;
    bottom:30px;
    right: 30px;
	z-index:1000;
	/*display:none;*/
}
#btn_pagetop {
	transition-duration:0.2s;
    cursor: pointer;
    margin-left: auto;
}
#btn_pagetop  a:hover img{
	opacity:1;
}
#btn_pagetop  img{max-width: 100%;height: auto;}
@media (max-width : 768px) {
.l-footer {
}
.l-footer .l-footer__inner {
    width: 100%;
    margin: 0 auto;
    padding: 0;
}
.l-footer_copy{
font-size: 1.8rem;
margin: 3.0rem auto 0;
}
#page-top{
    bottom: 2rem;
    right: 10px;
	width:30px;
    height: 30px;
}
.btn_pagetop_wrap{
	width:20px;
	height:100px;
    bottom:8px;
    right: 8px;
}
}


/***** pg wrap ****/
.pg_wrap{
width: 100%;
margin: 0 auto;
}
@media screen and (max-width: 1280px) {
.pg_wrap{
}
}
@media screen and (max-width: 768px) {
.pg_wrap{
}
}

img {
vertical-align: bottom;
margin: 0;
padding: 0;
}
img {
}

/*****コンテンツ****/
.contents{
	margin-top:0em;
	min-height:500px;
	margin-bottom:0;
}
.main_contents{
position: relative;
/*max-width: 1140px;*/
margin: 0 auto;
/*padding: 0 30px;*/
}
.w_conts{
width: 90%;
max-width: 1400px;
margin: 0 auto 0;
}

@media screen and (max-width: 768px) {
.contents{
	margin-top:0em;
	margin-bottom:0em;
}
.main_contents{
width: 100%;
padding: 0;
}
.menu-logo_tko{
width: 40px;
margin-right: 15px;
margin-bottom: 3px;
}
.menu-logo_que{
width: 42px;
}
}

/***** BG ****/
.bg_plus_wrap{
background: url("../img/bg_plus.png") top center repeat;
}
@media screen and (max-width: 768px) {
.bg_plus_wrap{
background-size: 25px auto;
}
}

/***** MV ****/
.mv_wrap{
position: relative;
overflow: hidden;
}
.mv_catch{
width: 60%;
max-width: 721px;
margin: 2rem auto;
}
.mv_photo{
margin: 8rem auto;
}
.mv_read{
font-size: 2.0rem;
font-weight: 600;
text-align: center;
line-height: 2.0;
margin: 6rem auto;
}
.top_bg_parts{
position: absolute;
z-index: -1;
}
.top_bg_parts_01{
width: 220px;
top: 0;
left: 50%;
margin-left: -720px;
}
.top_bg_parts_02{
width: 220px;
top: 0;
left: 50%;
margin-left: 480px;
}
.top_bg_parts_03{
width: 220px;
bottom: 0;
left: 50%;
margin-left: -700px;
}
.top_bg_parts_04{
width: 220px;
bottom: 0;
left: 50%;
margin-left: 460px;
}
.obi_slide{
width: 100%;
overflow: hidden;
margin: 8rem auto;
}
.obi_slide_fig{
  display: flex;
  width: 100%;
  height: auto;
  overflow: hidden;
  vertical-align: bottom;
}
.obi_slide_fig img {
  width: 100%;
  height: auto;
  vertical-align: bottom;
}
.obi_slide_fig img:first-child {
  animation: loop1 30s -15s linear infinite;
}
.obi_slide_fig img:last-child {
  animation: loop2 30s linear infinite;
}
@keyframes loop1 {
  0% {
    transform: translateX(100%);
  }
  to {
    transform: translateX(-100%);
  }
}

@keyframes loop2 {
  0% {
    transform: translateX(0%);
  }
  to {
    transform: translateX(-200%);
  }
}
@media screen and (max-width: 1400px) {
.top_bg_parts{
width: 16%;
}
.top_bg_parts_01{
top: 0;
left: -2%;
margin-left: 0;
}
.top_bg_parts_02{
top: 0;
left: auto;
right: -2%;
margin-left: 0;
}
.top_bg_parts_03{
bottom: 0;
left: 2%;
margin-left: 0;
}
.top_bg_parts_04{
bottom: 0;
left: auto;
right: 2%;
margin-left: 0;
}
}
@media screen and (max-width: 768px) {
.mv_wrap{
}
.mv_catch{
width: 75%;
max-width: inherit;
margin: 4rem auto;
}
.mv_photo{
width: 190%;
margin: 6rem 0 6rem -10%;
}
.mv_read{
font-size: 3.0rem;
margin: 6rem auto;
}
.top_bg_parts{
width: 16%;
}
.top_bg_parts_01{
top: 0;
left: -4%;
}
.top_bg_parts_02{
top: 0;
right: -5%;
}
.top_bg_parts_03{
bottom: 25%;
left: -5%;
}
.top_bg_parts_04{
bottom: 25%;
right: -4%;
}
.obi_slide_fig{
  width: 200%;
}
.obi_slide_fig img {
  object-fit: cover;
}
.obi_slide_fig img:first-child {
  animation: loop1 20s -10s linear infinite;
}
.obi_slide_fig img:last-child {
  animation: loop2 20s linear infinite;
}
}

/***** MV B ****/
.mv_typeb_main{
position: relative;
}
.mv_typeb_main img{
  width: 1800px;
  height: 1240px;
  object-fit: cover;
  object-position: center;
}
@media screen and (max-width: 1400px) {
.mv_typeb_main{
width: 130%;
margin-left: -15%;
}
.mv_typeb_main img{
  width: 100%;
  height: auto;
}
}
@media screen and (max-width: 768px) {
.mv_typeb_main{
width: 100%;
margin-left: 0;
}
}

/***** information ****/
.information_wrap{
width: 90%;
max-width: 1000px;
margin: 8rem auto;
}
.information_ttl{
font-size: 2.6rem;
font-weight: 600;
text-align: center;
margin: 0 auto 2rem;
}
ul.information_list{

}
ul.information_list li{
background: #FFF;
padding: 3rem;
margin-bottom: 3px;
font-size: 1.8rem;
font-weight: 500;
}
ul.information_list li span{
display: block;
}
ul.information_list li a{
color: #2e5b99;
}
ul.information_list li a:hover{
opacity: 0.8;
}
.info_more_btn{
text-align: center;
margin-top: 4rem;
}
.info_more_btn a {
  position: relative;
  display: block;
  max-width: 350px;
  padding: 1.5rem;
  background-color: #2a6aa2;
  border-radius: 8rem;
  font-size: 2.0rem;
  font-weight: 600;
  color: #fff;
  text-decoration: none;
  text-align: center;
  margin: 0 auto;
}
.info_more_btn a::after {
  content: '';
  position: absolute;
  top: 0;
  bottom: 0;
  right: 27px;
  width: 9px;
  height: 9px;
  margin: auto;
  border-top: 2px solid #fff;
  border-right: 2px solid #fff;
  transform: rotate(45deg);
  box-sizing: border-box;
}
.info_more_btn a:hover{
opacity: 0.8;
}
@media screen and (max-width: 768px) {
.information_wrap{
width: 90%;
margin: 8rem auto;
}
.information_ttl{
font-size: 3.6rem;
margin: 0 auto 3rem;
}
ul.information_list li{
padding: 3rem;
margin-bottom: 3px;
font-size: 2.6rem;
}
.info_more_btn{
width: 60%;
margin: 4rem auto 0;
}
.info_more_btn a {
  padding: 2rem 2rem;
  border-radius: 8rem;
  font-size: 3.0rem;
}
.info_more_btn a::after {
}
}


/***** blue_block ****/
.blue_block{
position: relative;
background: #2e5b99;
padding: 3rem;
width: 96%;
max-width: 1400px;
margin: 10rem auto;
border-radius: 8rem;
}
@media screen and (max-width: 768px) {
.blue_block{
padding: 3rem;
width: 96%;
margin: 10rem auto;
border-radius: 8rem;
}
}

/***** nayami ****/
.nayami_wrap{
width: 90%;
max-width: 1000px;
margin: 6rem auto;
}
.nayami_ttl{
width: 80%;
max-width: 800px;
margin: 0 auto 8rem;
}
.nayami_box_wrap{
display: flex;
flex-wrap: wrap;
}
.nayami_box{
width: 50%;
text-align: center;
  position: relative;
  display: inline-block;
  padding-bottom: 5rem;
  margin-bottom: 10px;
}
.nayami_box:nth-child(1):after,
.nayami_box:nth-child(2):after{
  content: '';
  position: absolute;
  left: 2%;
  bottom: -5px;
  display: inline-block;
  width: 96%;
  height: 2px;
  background-color:rgba(255,255,255,0.3);
}
.nayami_box:nth-child(2n){
border-left: solid 2px rgba(255,255,255,0.3);
}
.nayami_box_fig{
width: 50%;
max-width: 250px;
margin: 0 auto;
}
.nayami_box:nth-child(3) .nayami_box_fig,
.nayami_box:nth-child(4) .nayami_box_fig{
margin-top: 5rem;
}
.nayami_box_ttl{
font-size: 3.0rem;
color: #feef4d;
font-weight: 600;
margin: 0 auto 1rem;
}
.nayami_box_read{
font-size: 1.7rem;
color: #FFF;
font-weight: 600;
width: 96%;
margin: 0 auto;
}
@media screen and (max-width: 768px) {
.nayami_wrap{
width: 94%;
margin: 6rem auto;
}
.nayami_ttl{
width: 84%;
margin: 0 auto 8rem;
}
.nayami_box_wrap{
display: flex;
flex-wrap: wrap;
}
.nayami_box{
width: 100%;
  padding-bottom: 4rem;
  margin-bottom: 4rem;
}
.nayami_box:nth-child(1):after,
.nayami_box:nth-child(2):after{
display: none;
}
.nayami_box:nth-child(2n){
border-left:none;
}
.nayami_box_fig{
width: 60%;
max-width: inherit;
margin: 0 auto;
}
.nayami_box:nth-child(3) .nayami_box_fig,
.nayami_box:nth-child(4) .nayami_box_fig{
margin-top: 0;
}
.nayami_box_ttl{
font-size: 4.2rem;
margin: 0 auto 1rem;
}
.nayami_box_read{
font-size: 2.8rem;
width: 100%;
margin: 0 auto;
}
}

/***** kouchoku ****/
.kouchoku_wrap{
width: 90%;
max-width: 1000px;
margin: 6rem auto;
}
.kouchoku_ttl{
width: 53%;
max-width: 530px;
margin: 12rem auto 8rem;
}
.kouchoku_box_01{
display: flex;
align-items: center;
justify-content:space-between;
background: #FFF;
border-radius: 2rem;
}
.kouchoku_box_01_read{
font-size: 2.0rem;
font-weight: 500;
color: #5d5c5c;
margin: 2rem 2rem 2rem 6rem;
line-height: 1.8;
}
.kouchoku_box_01_fig{
width: 42%;
max-width: 412px;
}
.kouchoku_box_01_fig img{
border-radius: 0 2rem 2rem 0;
}
.kouchoku_box_arrow{
width: 65%;
max-width: 650px;
margin: 3rem auto;
}
.kouchoku_box_02{
position: relative;
width: 100%;
background: #FFF;
border-radius: 2rem;
}
.kouchoku_box_02_read{
position: absolute;
width: 90%;
left: 5%;
top: 5rem;
font-size: 2.0rem;
font-weight: 500;
color: #404040;
text-align: center;
line-height: 1.8;
}
.kouchoku_box_02_read_a{
font-size: 4.2rem;
font-weight: 600;
}
.kouchoku_box_02_read_b{
font-size: 3.0rem;
}
.kouchoku_box_02_fig{
padding-top: 6rem;
}
.kouchoku_box_02_fig img{
border-radius: 2rem;
}
@media screen and (max-width: 768px) {
.kouchoku_wrap{
width: 94%;
margin: 6rem auto;
}
.kouchoku_ttl{
width: 90%;
max-width: inherit;
margin: 8rem auto 5rem;
}
.kouchoku_box_01{
display: flex;
flex-direction: column;
background: #FFF;
border-radius: 2rem;
}
.kouchoku_box_01_read{
font-size: 2.8rem;
width: 80%;
margin: 5rem auto;
line-height: 1.8;
}
.kouchoku_box_01_fig{
width: 100%;
max-width: inherit;
}
.kouchoku_box_01_fig img{
border-radius: 0 0 2rem 2rem;
}
.kouchoku_box_arrow{
width: 55%;
margin: 3rem auto;
}
.kouchoku_box_02{
border-radius: 2rem;
}
.kouchoku_box_02_read{
position: absolute;
width: 96%;
left: 2%;
top: 5rem;
font-size: 2.8rem;
}
.kouchoku_box_02_read_a{
font-size: 3.9rem;
}
.kouchoku_box_02_read_b{
font-size: 2.8rem;
}
.kouchoku_box_02_fig{
padding-top: 10rem;
}
.kouchoku_box_02_fig img{
border-radius: 2rem;
}
}


/***** sub main ****/
.submain_wrap{
position: relative;
overflow: hidden;
margin: 10rem auto;
padding-bottom: 5rem;
}
.submain_catch{
width: 65%;
max-width: 725px;
margin: 3rem auto;
}
.submain_catch_b{
width: 40%;
max-width: 520px;
margin: 3rem auto;
}
.submain_read{
font-size: 2.4rem;
font-weight: 500;
text-align: center;
line-height: 2.0;
color: #404040;
margin: 6rem auto;
}
.kankeisei_wrap{
width: 90%;
max-width: 1000px;
margin: 6rem auto;
}
.kankeisei_box_wrap{
display: flex;
justify-content:space-between;
}
.kankeisei_box{
width: 48%;
}
.kankeisei_fuki{
  position: relative;
  display: inline-block;
  width: 100%;
  margin-bottom: 20px;
  padding: 1.5rem 1.0rem 1.8rem;
  border-radius: 1.0rem;
  background-color: #01beb3;
  text-align: center;
  font-size: 3.0rem;
  font-weight: 600;
  line-height: 1.8;
  color: #ffffff;
}
.kankeisei_fuki::after {
  content: "";
  position: absolute;
  bottom: 0;
  left: 50%;
  border-style: solid;
  border-width: 20px 15px 0 15px;
  border-color: #01beb3 transparent transparent;
  translate: -50% 100%;
}
.kankeisei_fig{
width: 90%;
max-width: 430px;
margin: 3rem auto 3rem;
}
.kankeisei_read{
font-size: 1.8rem;
text-align: center;
line-height: 1.8;
}
.submain_bg_parts{
position: absolute;
z-index: -1;
}
.submain_bg_parts_01{
width: 220px;
top: 0;
left: 50%;
margin-left: -720px;
}
.submain_bg_parts_02{
width: 220px;
top: 0;
left: 50%;
margin-left: 480px;
}
.submain_bg_parts_03{
width: 220px;
top: 50%;
left: 50%;
margin-left: -780px;
}
.submain_bg_parts_04{
width: 220px;
top: 50%;
left: 50%;
margin-left: 520px;
}
.submain_bg_parts_b{
position: absolute;
z-index: 0;
}
.submain_bg_parts_b_01{
width: 400px;
top: 0;
left: 50%;
margin-left: -720px;
}
.submain_bg_parts_b_02{
width: 400px;
top: 0;
left: 50%;
margin-left: 320px;
}
@media screen and (max-width: 1400px) {
.submain_bg_parts{
width: 16%;
}
.submain_bg_parts_01{
top: 0;
left: -2%;
margin-left: 0;
}
.submain_bg_parts_02{
top: 0;
left: auto;
right: -2%;
margin-left: 0;
}
.submain_bg_parts_03{
top: 50%;
left: -4%;
margin-left: 0;
}
.submain_bg_parts_04{
top: 50%;
left: auto;
right: -4%;
margin-left: 0;
}
.submain_bg_parts_b_01{
width: 28%;
top: 0;
left: -2%;
margin-left: 0;
}
.submain_bg_parts_b_02{
width: 28%;
top: 0;
left: auto;
right: -3%;
margin-left: 0;
}
}
@media screen and (max-width: 768px) {
.submain_wrap{
margin: 3rem auto 8rem;
}
.submain_catch{
width: 80%;
max-width: 725px;
margin: 10rem auto 5rem;
}
.submain_catch_b{
width: 60%;
margin: 3rem auto;
}
.submain_read{
font-size: 2.8rem;
margin: 6rem auto;
}
.kankeisei_wrap{
width: 90%;
margin: 2rem auto 6rem;
}
.kankeisei_box_wrap{
display: flex;
flex-direction: column;
}
.kankeisei_box{
width: 100%;
margin-top: 5rem;
}
.kankeisei_fuki{
  margin-bottom: 20px;
  padding: 2.5rem 1.0rem 2.8rem;
  border-radius: 1.5rem;
  font-size: 3.8rem;
}
.kankeisei_fuki::after {
}
.kankeisei_fig{
width: 85%;
max-width: 430px;
margin: 3rem auto 3rem;
}
.kankeisei_read{
font-size: 2.8rem;
}
.submain_bg_parts{
width: 16%;
}
.submain_bg_parts_01{
top: 0;
left: -3%;
}
.submain_bg_parts_02{
top: 0;
right: -3%;
}
.submain_bg_parts_03{
top: 14%;
left: -5%;
}
.submain_bg_parts_04{
top: 12%;
right: -4%;
}
.submain_bg_parts_b_01{
width: 20%;
top: 0;
left: -3.5%;
}
.submain_bg_parts_b_02{
width: 20%;
top: 0;
left: auto;
right: -3.5%;
}
}



/***** approach ****/
.sec_wrap_approach{
max-width: 1400px;
margin: 6rem auto;
}
.sec_ttl_en{
max-width: 150px;
margin: 0 auto 3rem;
}
.sec_ttl_jp{
font-size: 3.2rem;
font-weight: 800;
text-align: center;
margin: 2rem auto;
}
.sec_ttl_jp_sub{
font-size: 2.2rem;
text-align: center;
margin: 2rem auto;
}
.approach_box{
display: flex;
align-items: center;
margin: 6rem auto;
}
.approach_box_01{
justify-content: flex-start;
}
.approach_box_02{
justify-content: flex-end;
}
.approach_box_photo{
width: 52%;
}
.approach_box_read{
width: 36%;
}
.approach_box_01 .approach_box_read{
margin-left: 5rem;
}
.approach_box_02 .approach_box_read{
margin-right: 5rem;
}
.approach_box_ttl{
font-size: 4.5rem;
font-weight: 600;
color: #FFF;
position: relative;
}
.approach_box_01 .approach_box_ttl{
margin-left: -8rem;
}
.approach_box_02 .approach_box_ttl{
margin-right: -40rem;
}
.highlight {
background: linear-gradient(145deg,rgba(30, 131, 205, 1) 0%, rgba(30, 101, 200, 1) 100%);
  padding: 0.5rem 1.5rem 0.8rem;
  line-height: 1.6;
  box-decoration-break: clone;
  -webkit-box-decoration-break: clone;
}
.approach_box_txt{
font-size: 1.8rem;
margin-top: 3rem;
}
@media screen and (max-width: 980px) {
.approach_box_ttl{
font-size: 3.6rem;
}
}
@media screen and (max-width: 768px) {
.sec_wrap_approach{
width: 94%;
margin: 6rem auto;
}
.sec_ttl_en{
width: 35%;
margin: 0 auto 3rem;
}
.sec_ttl_jp{
font-size: 4.0rem;
margin: 3rem auto;
}
.sec_ttl_jp_sub{
font-size: 3.0rem;
margin: 3rem auto;
}
.approach_box{
flex-direction: column;
margin: 6rem auto;
}
.approach_box_01{
}
.approach_box_02{
}
.approach_box_photo{
width: 100%;
}
.approach_box_read{
width: 100%;
}
.approach_box_01 .approach_box_read{
margin-left: 0rem;
}
.approach_box_02 .approach_box_read{
margin-right: 0rem;
order: 1;
}
.approach_box_ttl{
font-size: 4.8rem;
margin-top: -3rem;
}
.approach_box_01 .approach_box_ttl{
margin-left: 0;
}
.approach_box_02 .approach_box_ttl{
margin-right: 0;
}
.highlight {
  padding: 1.0rem 2.0rem 1.2rem;
  line-height: 1.8;
}
.approach_box_txt{
font-size: 2.8rem;
margin-top: 3rem;
}
}

/***** program ****/
.sec_wrap_program{
width: 100%;
background: #f8f8f8;
margin: 10rem auto;
padding: 10rem 0;
}
.sec_wrap_program_inn{
width: 94%;
max-width: 1000px;
margin: 0 auto;
}
.program_tbl_wrap{
margin: 6rem auto 0;
}
table.program_tbl{
width: 100%;
border-collapse: collapse;
}
table.program_tbl td{
vertical-align: middle;
padding: 1.0rem 1.2rem;
color: #000;
line-height: 1.4;
}
.program_tbl_fig{
padding-bottom: 1.0rem;
}
table.program_tbl td.tbl_main{
width: 22.5%;
}
table.program_tbl td.tbl_head{
font-size: 1.3rem;
text-align: center;
font-weight: 400;
line-height: 1.4;
}
table.program_tbl td.tbl_head2{
line-height: 1.0;
}
table.program_tbl td.tbl_name{
font-size: 1.8rem;
font-weight: 600;
background: #88bcca;
border-left: solid 1px #FFF;
}
table.program_tbl td.tbl_thema{
font-size: 1.4rem;
background: #FFF;
padding-top: 1.2rem;
padding-bottom: 1.2rem;
}
table.program_tbl td.tbl_kouka{
font-size: 1.4rem;
background: #cfe3e8;
border-left: solid 1px #FFF;
padding-top: 1.2rem;
padding-bottom: 1.2rem;
}
.program_bnn{
max-width: 600px;
margin: 8rem auto 0;
}
.touch_icon{
display: none;
}
@media screen and (max-width: 768px) {
.sec_wrap_program{
margin: 10rem auto;
padding: 10rem 0;
}
.sec_wrap_program_inn{
width: 94%;
}
.program_tbl_wrap{
margin: 6rem auto 0;
overflow-x: scroll;
position: relative;
}
.touch_icon{
display: block;
position: absolute;
top: 50%;
left: 50%;
transform: translateY(-50%) translateX(-50%);
width: 40%;
max-width: 120px;
}
.program_tbl_wrap_inn{
width: 250%;
padding-bottom: 2rem;
}
table.program_tbl{
}
table.program_tbl td{
padding: 1.5rem 2.0rem;
}
.program_tbl_fig{
padding-bottom: 1.0rem;
}
table.program_tbl td.tbl_main{
width: 22.5%;
}
table.program_tbl td.tbl_head{
font-size: 2.3rem;
}
table.program_tbl td.tbl_head2{
}
table.program_tbl td.tbl_name{
font-size: 2.8rem;
}
table.program_tbl td.tbl_thema{
font-size: 2.4rem;
padding-top: 1.5rem;
padding-bottom: 1.5rem;
}
table.program_tbl td.tbl_kouka{
font-size: 2.4rem;
padding-top: 1.5rem;
padding-bottom: 1.5rem;
}
}


/***** evidence ****/
.sec_wrap_evidence{
width: 94%;
max-width: 1000px;
margin: 10rem auto;
}
.evidence_ttl{
font-size: 2.4rem;
font-weight: 700;
color: #03bcb3;
text-align: center;
margin-top: 6rem;
}
.evidence_ttl_read{
font-size: 1.8rem;
text-align: center;
margin: 1rem auto;
}
.evidence_block_wrap{
display: flex;
justify-content: center;
align-items: center;
background: #FFF;
padding: 4rem 2rem;
margin: 2rem auto;
}
.evidence_box_01{
max-width: 410px;
margin: 0 1rem;
}
.evidence_box_02{
max-width: 445px;
margin: 0 1rem;
}
.evidence_btm ul li{
font-size: 1.6rem;
margin: 0.4rem 0;
line-height: 1.4;
  padding-left: 1em;
  text-indent: -1em;
  font-weight: 400;
}
.evidence_btm ul li a{
color: #404040;
text-decoration: underline;
}
.evidence_btm_note{
font-size: 1.8rem;
margin-bottom: 1.0rem;
}
@media screen and (max-width: 768px) {
.sec_wrap_evidence{
width: 94%;
margin: 10rem auto;
}
.evidence_ttl{
font-size: 3.4rem;
margin-top: 8rem;
}
.evidence_ttl_read{
font-size: 2.8rem;
margin: 1.5rem auto;
}
.evidence_block_wrap{
flex-direction: column;
padding: 3rem 2rem;
margin: 4rem auto;
}
.evidence_box_01{
width: 100%;
max-width: 410px;
margin: 2rem auto;
}
.evidence_box_02{
width: 100%;
max-width: 445px;
margin: 2rem auto;
}
.evidence_btm ul li{
font-size: 2.4rem;
margin: 0.6rem 0;
}
.evidence_btm ul li a{
}
.evidence_btm_note{
font-size: 2.6rem;
}
}

/***** case ****/
.sec_wrap_casestd{
width: 100%;
background: #f8f8f8;
margin: 10rem auto;
padding: 10rem 0;
}
.sec_wrap_casestd_inn{
width: 94%;
max-width: 1400px;
margin: 0 auto;
}
.casestd_list_wrap{
display: flex;
column-gap:2rem;
margin: 6rem auto;
}
.casestd_list{
flex: 1;
background: #f3f3f3;
border-radius: 2rem;
display: flex;
flex-direction: column;
}
.casestd_list_fig img{
  width: 100%;
  height: auto;
  aspect-ratio: 16 / 9;
  object-fit: cover;
  border-radius: 2rem 2rem 0 0;
}
.casestd_list_name{
font-size: 1.6rem;
font-weight: 400;
width: 90%;
margin: 2rem auto 0;
}
.casestd_list_ttl{
font-size: 2.2rem;
font-weight: 600;
color: #2a6aa2;
width: 90%;
margin: 0.5rem auto 2rem;
line-height: 1.4;
}
.casestd_list_more{
margin-top: auto;
margin-bottom: 2.0rem;
width: 90%;
text-align: right;
}
.casestd_list_more a{
  position: relative;
  display: inline-block;
  font-size: 1.6rem;
  color: #2a6aa2;
  padding-right: 1.5rem;
}
.casestd_list_more a::after {
  content: '';
  position: absolute;
  top: 0;
  bottom: 0;
  right: 0;
  width: 9px;
  height: 9px;
  margin: auto;
  border-top: 2px solid #2a6aa2;
  border-right: 2px solid #2a6aa2;
  transform: rotate(45deg);
  box-sizing: border-box;
}
.casestd_list_more a::before {
  content: "";
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 2px;
  background-color: #2a6aa2;
}
.casestd_more_btn{
text-align: center;
}
.casestd_more_btn a {
  position: relative;
  display: block;
  max-width: 350px;
  padding: 1.5rem;
  background-color: #2a6aa2;
  border-radius: 8rem;
  font-size: 2.0rem;
  font-weight: 600;
  color: #fff;
  text-decoration: none;
  text-align: center;
  margin: 0 auto;
}
.casestd_more_btn a::after {
  content: '';
  position: absolute;
  top: 0;
  bottom: 0;
  right: 27px;
  width: 9px;
  height: 9px;
  margin: auto;
  border-top: 2px solid #fff;
  border-right: 2px solid #fff;
  transform: rotate(45deg);
  box-sizing: border-box;
}
.casestd_more_btn a:hover{
opacity: 0.8;
}
@media screen and (max-width: 768px) {
.sec_wrap_casestd{
margin: 10rem auto;
padding: 10rem 0;
}
.sec_wrap_casestd_inn{
width: 94%;
margin: 0 auto;
}
.casestd_list_wrap{
column-gap:0;
margin: 6rem auto;
}
.casestd_list{
flex: none;
background: #f3f3f3;
border-radius: 2rem;
display: flex;
flex-direction: column;
width: 100%;
}
.casestd_list_fig img{
  border-radius: 2rem 2rem 0 0;
}
.casestd_list_name{
font-size: 2.6rem;
margin: 3rem auto 0;
}
.casestd_list_ttl{
font-size: 3.2rem;
margin: 1.0rem auto 3rem;
line-height: 1.4;
}
.casestd_list_more{
margin-bottom: 4.0rem;
}
.casestd_list_more a{
  font-size: 2.6rem;
  padding-right: 2rem;
}
.casestd_list_more a::after {
}
.casestd_list_more a::before {
}
.casestd_more_btn{
width: 60%;
margin: 3rem auto 0;
}
.casestd_more_btn a {
  padding: 2rem 2rem;
  border-radius: 8rem;
  font-size: 3.0rem;
}
.casestd_more_btn a::after {
}
.swiper-area{
position: relative;
}
.swiper .swiper-slide {
	height: auto;
}
.swiper .swiper-slide-item {
	height: 100%;
}
.swiper-pagination-bullet {
  background-color: #ccc;
  opacity: 1; 
}
.swiper-pagination-bullet-active {
  background-color: #2a6aa2;
}
}

/***** qanda ****/
.qanda_area{
width: 94%;
max-width: 1000px;
margin: 15rem auto 0;
}
.qanda_block{
margin: 3rem auto 0;
}
.qanda_box_q{
font-size: 2.4rem;
font-weight: 600;
color: #FFF;
background: #88bcca;
padding: 1.5rem 2rem;
}
.qanda_box_a{
font-size: 1.8rem;
background: #f3f3f3;
padding: 2.5rem 3rem;
}
@media screen and (max-width: 768px) {
.qanda_area{
width: 94%;
margin: 15rem auto 0;
}
.qanda_block{
margin: 4rem auto 0;
}
.qanda_box_q{
font-size: 3.4rem;
padding: 2rem 3rem;
}
.qanda_box_a{
font-size: 2.8rem;
padding: 3.5rem 3.5rem;
}
}

/***** plan ****/
.sec_wrap_plan{
width: 94%;
max-width: 1000px;
margin: 10rem auto 0;
}
.plan_block_wrap{
display: flex;
justify-content:space-between;
column-gap: 3rem;
margin: 6rem auto 0;
}
.plan_box{
background: #ffffff;
border-radius: 3rem;
width: 50%;
}
.plan_box_01{
border:  solid 3px #2a6aa2;
}
.plan_box_02{
border:  solid 3px #00c0b6;
}
.plan_box_ttl{
font-size: 2.8rem;
font-weight: 600;
text-align: center;
padding: 2rem;
color: #FFF;
border-radius: 2.5rem 2.5rem 0 0;
}
.plan_box_ttl span{
font-size: 2.0rem;
font-weight: 500;
display: block;
}
.plan_box_01 .plan_box_ttl{
background:#2a6aa2;
}
.plan_box_02 .plan_box_ttl{
background: #00c0b6;
}
.plan_box_head_wrap{
padding: 2rem 3rem 3rem;
}
.plan_box_01 .plan_box_head{
color: #2a6aa2;
font-size: 2.4rem;
text-align: center;
font-weight: 700;
}
.plan_box_01 .plan_box_head span{
font-size: 5.0rem;
}
.plan_box_02 .plan_box_head{
color: #00c0b6;
font-size: 3.0rem;
text-align: center;
font-weight: 700;
padding-top: 2.5rem;
}
.plan_box_read{
font-size: 1.7rem;
margin: 2rem auto 0;
}
.plan_btm_read{
font-size: 2.0rem;
text-align: center;
margin: 4rem auto 0;
}
@media screen and (max-width: 768px) {
.sec_wrap_plan{
width: 94%;
margin: 10rem auto 0;
}
.plan_block_wrap{
flex-direction: column;
column-gap: 0;
margin: 4rem auto 0;
}
.plan_box{
border-radius: 3rem;
width: 100%;
margin: 2rem auto;
}
.plan_box_01{
}
.plan_box_02{
}
.plan_box_ttl{
font-size: 3.8rem;
padding: 3rem;
border-radius: 2rem 2rem 0 0;
}
.plan_box_ttl span{
font-size: 2.8rem;
}
.plan_box_01 .plan_box_ttl{
}
.plan_box_02 .plan_box_ttl{
}
.plan_box_head_wrap{
padding: 3rem 4rem 4rem;
}
.plan_box_01 .plan_box_head{
font-size: 3.4rem;
}
.plan_box_01 .plan_box_head span{
font-size: 8.0rem;
}
.plan_box_02 .plan_box_head{
font-size: 4.2rem;
padding-top:2rem;
}
.plan_box_read{
font-size: 2.5rem;
margin: 3rem auto 0;
}
.plan_btm_read{
font-size: 2.8rem;
margin: 2rem auto 0;
}
}


/***** flow ****/
.sec_wrap_flow{
width: 100%;
background: #00c0b6;
margin: 10rem auto 0;
padding: 10rem 0 4rem;
}
.sec_wrap_flow_inn{
width: 94%;
max-width: 1000px;
margin: 0 auto;
}
.sec_ttl_jp_flow{
font-size: 3.6rem;
font-weight: 700;
text-align: center;
color: #FFF;
margin-bottom: 5rem;
}
.flow_block_wrap{
display: flex;
justify-content: center;
}
.flow_box{
max-width: 240px;
}
.flow_sepa{
max-width: 62px;
margin-top: 110px;
}
.flow_box_read{
font-size: 2.0rem;
color: #FFF;
text-align: center;
margin-top: 2rem;
}
.flow_btn{
text-align: center;
margin: 5rem auto;
}
.flow_btn a {
  position: relative;
  display: block;
  max-width: 350px;
  padding: 1.5rem;
  background-color: #2a6aa2;
  border-radius: 8rem;
  font-size: 2.0rem;
  font-weight: 600;
  color: #fff;
  text-decoration: none;
  text-align: center;
  margin: 0 auto;
}
.flow_btn a::after {
  content: '';
  position: absolute;
  top: 0;
  bottom: 0;
  right: 27px;
  width: 9px;
  height: 9px;
  margin: auto;
  border-top: 2px solid #fff;
  border-right: 2px solid #fff;
  transform: rotate(45deg);
  box-sizing: border-box;
}
.flow_btn a:hover{
opacity: 0.8;
}
.flow_btm_read{
font-size: 1.8rem;
text-align: center;
color: #FFF;
margin: 4rem auto 14rem;
}
.foot_copy{
font-size: 1.4rem;
color: #FFF;
font-weight: 400;
}
@media screen and (max-width: 768px) {
.sec_wrap_flow{
margin: 10rem auto 0;
padding: 10rem 0 4rem;
}
.sec_wrap_flow_inn{
width: 94%;
margin: 0 auto;
}
.sec_ttl_jp_flow{
font-size: 4.2rem;
margin-bottom: 5rem;
}
.flow_block_wrap{
display: flex;
justify-content: center;
}
.flow_box{
max-width: 240px;
}
.flow_sepa{
max-width: 62px;
margin-top: 10vw;
}
.flow_box_read{
font-size: 2.4rem;
margin-top: 2rem;
}
.flow_btn{
text-align: center;
margin: 5rem auto;
width: 70%;
}
.flow_btn a {
  padding: 2.0rem 1.5rem;
  border-radius: 8rem;
  font-size: 3.0rem;
}
.flow_btn a::after {
}
.flow_btm_read{
font-size: 2.6rem;
margin: 4rem auto 12rem;
}
.foot_copy{
font-size: 2.0rem;
margin-left: 1.0rem;
}
}

/***** float bnn ****/
.float_bnn{
position: fixed;
bottom: 0;
right: 0;
background: #2b68ba;
border-top: solid 2px #FFF;
border-left: solid 2px #FFF;
border-radius: 2rem 0 0 0;
 box-shadow: 0px 0px 15px 0px rgba(0, 0, 0, 0.35);
 z-index: 2;
}
.float_bnn a{
display: block;
width: 100%;
height: 100%;
}
.float_bnn a:hover{
opacity: 0.8;
}
.float_bnn_inn{
display: flex;
align-items: center;
padding: 2.0rem 2.5rem 1.5rem;
}
.float_bnn_icon{
max-width: 90px;
}
.float_bnn_ttl{
font-size: 4.5rem;
font-weight: 800;
color: #feef4d;
margin: 0 2.0rem;
}
.float_bnn_read{
font-size: 1.8rem;
color: #FFF;
line-height: 1.4;
}
@media screen and (max-width: 768px) {
.float_bnn{
border-top: solid 2px #FFF;
border-left: solid 2px #FFF;
border-radius: 3rem 0 0 0;
 box-shadow: 0px 0px 15px 0px rgba(0, 0, 0, 0.35);
}
.float_bnn a{
}
.float_bnn a:hover{
}
.float_bnn_inn{
padding: 2.5rem 3.0rem 2.0rem;
}
.float_bnn_icon{
width: 30%;
max-width: 90px;
}
.float_bnn_ttl{
font-size: 4.5rem;
margin: 0 -8.0rem 0 3.0rem;
}
.float_bnn_read{
display: none;
}
}



/***** TOP LOGO ****/
.top_first_wrap{
/*height: 100svh;*/
position: relative;
background:url("../img/bg_dot_gray.svg") top left repeat;
background-size: 10px auto;
}
.top_first_read_wrap{
padding-top: 200px;
}
.top_first_read{
font-size: 3.4rem;
font-weight: 800;
letter-spacing: 0.1rem;
}
.top_first_read_sub{
font-size: 2.0rem;
font-weight: 700;
margin-top: 1.0rem;
letter-spacing: 0.4rem;
}
.top_logo {
max-width: 260px;
width: 90%;
position: fixed;
top: 55%;
left: 50%;
-webkit-transform: translate(-50%, -50%);
transform: translate(-50%, -50%);
}
.top_logo.hide{
opacity: 0;
}
.top_logo img{
width: 260px;
}
.top_first_bottom_wrap{
padding-top: 500px;
display: flex;
align-items: center;
justify-content: space-between;
padding-bottom: 3rem;
z-index: 2;
position: relative;
}
.top_first_bottom_logo{
display: flex;
align-items: flex-end;
margin-right: 20px;
}
.top_first_bottom_logo_item_tko{
width: 54px;
margin-right: 10px;
margin-bottom: 25px;
}
.top_first_bottom_logo_item_que{
width: 58px;
margin-bottom: 20px;
}
.top_first_bottom_pp{
max-width: 825px;
margin-right: 20px;
}
.top_first_bottom_p1circle{
max-width: 180px;
position: relative;
}
.top_first_bottom_p1circle_fig{
animation: rotateAnimation 8s linear infinite;
}
.top_first_bottom_p1circle_txt{
position: absolute;
top: 50%;
left: 50%;
-webkit-transform: translate(-50%, -50%);
transform: translate(-50%, -50%);
font-size: 2.4rem;
font-weight: 600;
}
.top_first_bottom_p1circle_sp,
.top_first_bottom_pp_sp{
display: none;
}
@media screen and (max-width: 768px) {
.top_first_wrap{
padding-bottom: 10.0rem;
overflow: hidden;
}
.top_logo {
top: 55vw;
left: 50%;
width: 40%;
-webkit-transform: translate(-50%, 0);
transform: translate(-50%, 0);
}
.top_first_read_wrap{
padding-top: 150vw;
text-align: center;
}
.top_first_read{
font-size: 4.6rem;
}
.top_first_read_sub{
font-size: 2.6rem;
margin-top: 2.0rem;
}
.top_first_bottom_wrap{
display: none;
}
.top_first_bottom_pp{
max-width: 825px;
margin-right: 20px;
}
.top_first_bottom_p1circle_sp{
display: block;
position: absolute;
right: -6vw;
bottom: 5vw;
width: 25%;
}
.top_first_bottom_pp_sp{
display: block;
position: absolute;
left: 0;
top: 20%;
width: 12%;
}
}

@keyframes rotateAnimation {
  from {
    transform: rotate(0deg);
  }
  to {
    transform: rotate(360deg);
  }
}

/***** box ****/
.main_box{
background: #FFF;
width: 100%;
margin: 0 auto;
position: relative;
padding-bottom: 5rem;
/*overflow: hidden;*/
}
.main_box_gray{
background: #f1f1f1 url("../img/bg_dot_white.svg") top left repeat;
background-size: 10px auto;
}
.main_box_white{
background: #ffffff url("../img/bg_dot_gray.svg") top left repeat;
background-size: 10px auto;
}
.main_head_icon_wrap{
position: sticky;
top: -20px;
left: 0;
padding-top: 8rem;
padding-bottom: 10rem;
z-index: 2;
}
.main_head_icon{
padding-left: 20rem;
}
.main_head_icon img{
width: 190px;
filter: drop-shadow(0px 6px 3px rgba(0,0,0,0.30));
}
.main_head_icon_01 img{
transform: rotate(-12deg);
}
.main_head_icon_02 img{
transform: rotate(12deg);
}
.main_head_icon_03 img{
transform: rotate(-10deg);
}
.main_head_icon_04 img{
transform: rotate(10deg);
}
.main_head_icon_05 img{
transform: rotate(-16deg);
}
.mazuwa_box_wrap{
width: 100%;
height: 260px;
position: absolute;
top: 0;
overflow: hidden;
}
.mazuwa_box{
position: absolute;
top: -4.0rem;
left: 50%;
margin-left: 250px;
background: #3AB3FF;
width: 260px;
height: 260px;
border-radius: 50%;
box-shadow: 8px 8px 2px 0px rgba(0, 0, 0, 0.2);
}
.mazuwa_box_txt{
font-size: 1.3rem;
font-weight: 600;
text-align: center;
padding-top: 8.5rem;
}
.mazuwa_box_txt span{
font-size: 2.4rem;
display: block;
margin: 0 auto 1.0rem;
}
.thirtyminfree_head_wrap{
display: flex;
align-items:flex-end;
padding-top: 2rem;
}
.thirtyminfree_head_ttl{
max-width: 570px;
margin-right: 6rem;
}
.thirtyminfree_head_side{
margin-bottom: 4rem;
}
.thirtyminfree_head_side_txt{
font-size: 2.6rem;
font-weight: 500;
letter-spacing: 0.8rem;
margin-bottom: 6.0rem;
}
.thirtyminfree_head_side_icon img{
width: 186px;
}
.swiper-area{
position: relative;
}
.swiper .swiper-slide {
	height: auto;
}
.swiper .swiper-slide-item {
	height: 100%;
}
.top_thirmin_area{
position: relative;
}
.top_thirmin_list{
padding-bottom: 10px;
}
.top_thirmin_box{
position: relative;
width: 90%;
max-width: 1200px;
background: #FFF;
border-radius: 2.0rem;
box-sizing: border-box;
border: solid 5px #212121;
box-shadow: 8px 8px 2px 0px rgba(0, 0, 0, 0.2);
}
.top_thirmin_num{
position: absolute;
top: 1.0rem;
right: 2.0rem;
font-size: 1.6rem;
}
.top_thirmin_main_wrap{
position: relative;
display: flex;
}
.top_thirmin_fig_01{
width: 40%;
max-width: 465px;
margin: 0 5% 0 6%;
}
.top_thirmin_fig_02{
width: 34%;
max-width: 394px;
margin: 0 5% 0 4%;
}
.top_thirmin_fig_03{
width: 40%;
max-width: 450px;
margin: 0 3% 0 3%;
}
.top_thirmin_read_03{
width: 50%;
}
.top_thirmin_read{
margin-top: 10.0rem;
}
.top_thirmin_ttl{
font-size: 4.0rem;
font-weight: 800;
letter-spacing: 0.2rem;
}
.top_thirmin_txt{
font-size: 1.5rem;
font-weight: 700;
line-height: 2.4;
margin-top: 3.0rem;
letter-spacing: 0.2rem;
}
.top_thirmin_txt span{
  text-decoration: underline #e1be58 3px;
  text-underline-offset: 4px;
}
.top_thirmin_table{
  border: 5px solid #000;
  border-collapse: separate;
  border-spacing: 0;
  border-radius: 1.5rem;
  overflow: hidden;
  margin-top: 3.0rem;
  width: 90%;
}
.top_thirmin_table th,
.top_thirmin_table td {
border-collapse: collapse;
  border-bottom: 1px solid #d9d9d9;
  text-align: center;
  padding: 1.3rem 2.0rem;
}
.top_thirmin_table th {
  background-color: #b6b7b8;
  font-size: 1.6rem;
  font-weight: 700;
  color: #FFF;
  width: 50%;
  vertical-align: middle;
}
.top_thirmin_table td {
  border-right: 1px solid #d9d9d9;
  font-size: 1.4rem;
  font-weight: 700;
  vertical-align: middle;
}
.top_thirmin_table tr:last-child th,
.top_thirmin_table tr:last-child td {
  border-bottom: none;
}

.bottom_en{
position: absolute;
right: 0;
bottom: 0;
}
.bottom_en img{
height: 189px;
width: auto;
object-fit: cover;
}
@media screen and (max-width: 768px) {
.main_box{
padding-bottom: 5rem;
}
.main_box_gray{
background-size: 10px auto;
}
.main_box_white{
background-size: 10px auto;
}
.main_head_icon_wrap{
top: 30px;
padding-top: 8rem;
padding-bottom: 10rem;
}
.main_head_icon{
padding-left: 3rem;
}
.main_head_icon img{
width: 35%;
}
.main_head_icon_01 img{
transform: rotate(-12deg);
}
.main_head_icon_02 img{
transform: rotate(-12deg);
}
.main_head_icon_03 img{
transform: rotate(-12deg);
}
.main_head_icon_04 img{
transform: rotate(-12deg);
}
.main_head_icon_05 img{
transform: rotate(-12deg);
}
.mazuwa_box_wrap{
width: 100%;
height: 260px;
position: absolute;
top: 0;
overflow: hidden;
}
.mazuwa_box{
top: -6.0rem;
left: auto;
right: -4.0rem;
margin-left: 0;
width: 32rem;
height: 32rem;
}
.mazuwa_box_txt{
font-size: 1.8rem;
padding-top: 10.0rem;
}
.mazuwa_box_txt span{
font-size: 2.8rem;
margin: 0 auto 1.0rem;
}
.thirtyminfree_head_wrap{
align-items:flex-start;
padding-top: 1rem;
flex-direction: column;
width: 80%;
margin: 4rem auto 0;
}
.thirtyminfree_head_ttl{
max-width: inherit;
margin-right: 0;
}
.thirtyminfree_head_side{
margin-bottom: 4rem;
}
.thirtyminfree_head_side_txt{
font-size: 5.4rem;
letter-spacing: 0.8rem;
margin-bottom: 5.0rem;
margin-top: 3.0rem;
}
.thirtyminfree_head_side_icon{
width: 80%;
}
.thirtyminfree_head_side_icon img{
width: 100%;
max-width: 200px;
}
.swiper-area{
}
.swiper .swiper-slide {
}
.swiper .swiper-slide-item {
}
.top_thirmin_area{
}
.top_thirmin_list{
padding-bottom: 10px;
}
.top_thirmin_box{
width: 90%;
border-radius: 1.0rem;
border: solid 3px #212121;
box-shadow: 6px 6px 2px 0px rgba(0, 0, 0, 0.2);
}
.top_thirmin_num{
display: none;
}
.top_thirmin_main_wrap{
display: flex;
flex-direction: column;
}
.top_thirmin_fig_01{
width: 85%;
max-width: inherit;
margin: 0 10% 0 5%;
}
.top_thirmin_fig_02{
width: 100%;
max-width: inherit;
margin: 0 0 0 0;
}
.top_thirmin_fig_03{
width: 95%;
max-width: inherit;
margin: 0 5% 0 0;
order: 1;
}
.top_thirmin_read{
width: 88%;
margin: 3rem 6% 3rem;
}
.top_thirmin_read_03{
width: 88%;
}
.top_thirmin_ttl{
font-size: 5.8rem;
letter-spacing: 0.2rem;
}
.top_thirmin_read_02 .top_thirmin_ttl,
.top_thirmin_read_03 .top_thirmin_ttl{
font-size: 4.2rem;
letter-spacing: 0;
}
.top_thirmin_txt{
font-size: 2.1rem;
line-height: 2.4;
margin-top: 3.0rem;
letter-spacing: 0;
}
.top_thirmin_txt span{
  text-decoration: underline #e1be58 2px;
  text-underline-offset: 3px;
}
.top_thirmin_table{
  border: 3px solid #000;
  border-radius: 2rem;
  margin-top: 3.0rem;
  width: 100%;
}
.top_thirmin_table th,
.top_thirmin_table td {
  padding: 1.2rem 1.2rem;
}
.top_thirmin_table th {
  font-size: 2.2rem;
}
.top_thirmin_table td {
  font-size: 2.0rem;
}
.top_thirmin_table tr:last-child th,
.top_thirmin_table tr:last-child td {
  border-bottom: none;
}
.bottom_en{
position: absolute;
right: 0;
bottom: 0;
width: 100%;
}
.bottom_en img{
height: auto;
width: 100%;
}
}


/***** case ****/
.top_case_area{
position: relative;
}
.top_case_list{
padding-bottom: 10px;
}
.top_case_box{
position: relative;
width: 90%;
max-width: 1200px;
}
.top_case_head_wrap{
display: flex;
align-items: flex-end;
justify-content: space-between;
margin-bottom: 3.0rem;
}
.top_case_head_inn{
display: flex;
}
.top_case_head_inn_num{
font-size: 3.7rem;
color: #137CF8;
font-weight: 500;
margin-right: 2.0rem;
}
.top_case_main_wrap2 .top_case_head_inn_num{
color: #FF8419;
}
.top_case_head_inn_ttl{
font-size: 3.7rem;
font-weight: 700;
}
.top_case_head_inn_ttl_sub{
font-size: 1.3rem;
}
.top_case_head_icon{
display: inline-block;
background: #137CF8;
font-size: 1.6rem;
color: #FFF;
border-radius: 1.0rem;
padding: 0.5rem 2.0rem;
letter-spacing: 0.1rem;
font-style: italic;
}
.top_case_main_wrap2 .top_case_head_icon{
background: #FF8419;
}
.top_case_slide_list{
display: flex;
flex-wrap: wrap;
justify-content: space-between;
}
.top_case_slide_list_item{
width: 32%;
border: solid 3px #212121;
margin-bottom: 2%;
box-shadow: 0px 4px 5px 0px rgba(0, 0, 0, 0.3);
}
.top_case_ttl{
font-size: 2.2rem;
font-weight: 700;
margin: 1.5rem auto 1rem;
}
.top_case_txt{
font-size: 1.5rem;
margin: 0.5rem 0;
  padding-left: 1em;
  text-indent: -1em;
}
.top_case_txt span{
  text-decoration: underline #137CF8 3px;
  text-underline-offset: 4px;
}
.top_case_main_wrap2 .top_case_txt span{
  text-decoration: underline #FF8419 3px;
}
@media screen and (max-width: 768px) {
.top_case_area{
}
.top_case_list{
display: flex;
flex-direction: column;
width: 90%;
margin: 0 auto;
}
.top_case_box{
position: relative;
width: 100%;
max-width: inherit;
margin-bottom: 5rem;
}
.top_case_head_wrap{
display: flex;
align-items: flex-start;
justify-content: space-between;
margin-bottom: 3.0rem;
}
.top_case_head_inn{
}
.top_case_head_inn_num{
font-size: 3.7rem;
margin-right: 2.0rem;
}
.top_case_main_wrap2 .top_case_head_inn_num{
color: #FF8419;
}
.top_case_head_inn_ttl{
font-size: 3.7rem;
}
.top_case_head_inn_ttl_sub{
font-size: 2.0rem;
}
.top_case_head_icon{
font-size: 1.8rem;
border-radius: 1.0rem;
padding: 0.5rem 2.0rem;
margin-top: 1.2rem;
}
.top_case_main_wrap2 .top_case_head_icon{
}
.top_case_slide_list{
display: flex;
flex-wrap:nowrap;
justify-content: space-between;
}
.top_case_slide_list_item{
width: 100%;
border: solid 2px #212121;
margin-bottom: 2%;
}
.top_case_ttl{
font-size: 2.6rem;
margin: 1.5rem auto 1rem;
}
.top_case_txt{
font-size: 2.0rem;
margin: 0.5rem 0;
}
.top_case_txt span{
  text-decoration: underline #137CF8 2px;
  text-underline-offset: 3px;
}
.top_case_main_wrap2 .top_case_txt span{
  text-decoration: underline #FF8419 2px;
}
}


/***** what ****/
.whats_head_wrap{
display: flex;
justify-content: center;
margin: 6rem auto;
}
.whats_head_item{
text-align: center;
}
.whats_head_item_txt{
font-size: 3.2rem;
font-weight: 700;
margin-bottom: 3.0rem;
}
.whats_head_item_logo_tko img{
width: 272px;
}
.whats_head_item_logo_que{
margin-top: 7.5rem;
}
.whats_head_item_logo_que img{
width: 296px;
}
.whats_head_kakeru{
align-self: flex-end;
margin:0 6rem  2.0rem;
}
.whats_head_kakeru img{
width: 100%;
max-width: 120px;
}
.whats_sub_wrap{
display: flex;
justify-content: center;
align-items: center;
margin: 6rem auto;
}
.whats_sub_equal{
margin-left: 10rem;
}
.whats_sub_equal img{
width: 100%;
max-width: 60px;
}
.whats_sub_p2{
margin: 0 3rem;
}
.whats_sub_p2 img{
width: 100%;
max-width: 140px;
}
.whats_sub_read{
font-size: 1.3rem;
font-weight: 700;
line-height: 1.8;
}
.whats_bottom_wrap{
max-width: 600px;
margin: 6rem auto;
}
.top_whats_table{
  border: 5px solid #000;
  border-collapse: separate;
  border-spacing: 0;
  border-radius: 1.5rem;
  overflow: hidden;
  margin-top: 3.0rem;
  width: 100%;
  background: #FFF;
}
.top_whats_table th,
.top_whats_table td {
border-collapse: collapse;
  border-bottom: 1px solid #b3b3b3;
  text-align: center;
  padding: 1.6rem 2.0rem;
}
.top_whats_table th {
  background-color: #d8d8d8;
  border-right: 1px solid #b3b3b3;
  font-size: 1.6rem;
  font-weight: 700;
  color: #FFF;
  width: 50%;
  vertical-align: middle;
}
.top_whats_table td {
  border-right: 1px solid #b3b3b3;
  font-size: 1.4rem;
  font-weight: 700;
  vertical-align: middle;
}
.top_whats_table tr:last-child th,
.top_whats_table tr:last-child td {
  border-bottom: none;
}
.table_logo1{
width: 100%;
max-width: 48px;
}
.table_logo2{
width: 100%;
max-width: 57px;
}
.whats_bottom_txt{
font-size: 4.8rem;
font-weight: 900;
margin: 3rem auto;
}
@media screen and (max-width: 768px) {
.whats_head_wrap{
display: flex;
justify-content: center;
flex-direction: column;
margin: 6rem auto;
}
.whats_head_item{
text-align: center;
display: flex;
justify-content: center;
flex-direction: column;
}
.whats_head_item_txt{
font-size: 4.2rem;
margin-bottom: 3.0rem;
margin-top: 3.0rem;
order: 1;
}
.whats_head_item_logo_tko{
text-align: center;
}
.whats_head_item_logo_tko img{
width: 50%;
max-width:272px;
}
.whats_head_item_logo_que{
margin-top: 0;
text-align: center;
}
.whats_head_item_logo_que img{
width: 50%;
max-width: 296px;
}
.whats_head_kakeru{
align-self: center;
margin:3rem auto 6rem;
text-align: center;
}
.whats_head_kakeru img{
width: 50%;
max-width: 120px;
}
.whats_sub_wrap{
display: flex;
justify-content: center;
align-items: center;
flex-direction: column;
margin: 6rem auto 0;
}
.whats_sub_equal{
margin-left: 0;
transform: rotate(90deg);
text-align: center;
}
.whats_sub_equal img{
width: 80%;
max-width: 60px;
}
.whats_sub_p2{
margin: 6rem auto 4rem;
text-align: center;
}
.whats_sub_p2 img{
width: 100%;
max-width: 160px;
}
.whats_sub_read{
font-size: 2.0rem;
line-height: 1.8;
}
.whats_bottom_wrap{
width: 80%;
max-width: 600px;
margin: -18rem auto 6rem;
position: relative;
}
.top_whats_table{
  border: 3px solid #000;
  border-radius: 2rem;
  margin-top: 3.0rem;
}
.top_whats_table th,
.top_whats_table td {
  padding: 1.8rem 1.5rem;
}
.top_whats_table th {
  font-size: 2.6rem;
}
.top_whats_table td {
  font-size: 2.0rem;
}
.top_whats_table tr:last-child th,
.top_whats_table tr:last-child td {
  border-bottom: none;
}
.table_logo1{
width: 50%;
max-width: 48px;
}
.table_logo2{
width: 50%;
max-width: 57px;
}
.whats_bottom_txt{
font-size: 5.8rem;
margin: 5rem auto;
}
}


/***** plan ****/
.top_plan_wrap{
display: flex;
border-right: solid 1px #000;
}
.top_plan_item{
width: calc(100% / 3);
background: #FFF;
border-left: solid 1px #000;
}
.top_plan_item_head{
padding: 2.0rem 2.5rem;
}
.top_plan_item_ttl{
font-size: 3.5rem;
font-weight: 500;
}
.top_plan_item_ttl_sub{
font-size: 1.6rem;
opacity: 0.55;
}
.top_plan_item_price_wrap{
display: flex;
align-items: baseline;
margin: 2rem auto 2rem;
}
.top_plan_item_price_en{
font-size: 5.5rem;
font-weight: 700;
}
.top_plan_item_price_jp{
font-size: 2.5rem;
font-weight: 600;
}
.top_plan_item_price_jp2{
font-size: 1.5rem;
font-weight: 400;
opacity: 0.55;
margin-left: 1.0rem;
}
ul.top_plan_txt_list{
min-height: 12rem;
}
ul.top_plan_txt_list li{
font-size: 1.5rem;
padding-left: 3.0rem;
background: url("../img/plan_icon_check.png") left center no-repeat;
background-size: 24px auto;
margin: 0.5rem auto;
}
.top_plan_item_btm{
padding: 2.0rem 2.5rem;
}
.top_plan_item_btm_inn{
  display: flex;
  justify-content: center;
  align-items: center;
  min-height: 30rem;
  border-top: solid 1px #d9d9d9;
  padding-top: 3.0rem;
}
.top_plan_item_btm_txt{
font-size: 1.9rem;
text-align: center;
}
.top_plan_item_btm_txt span{
display: block;
font-size: 1.5rem;
color: #5A70ED;
font-weight: 800;
}
@media screen and (max-width: 768px) {
.top_plan_wrap{
display: flex;
flex-direction: column;
border-right: none;
}
.top_plan_item{
width: 100%;
border-left: none;
border-top: solid 1px #666;
}
.top_plan_item:first-child{
border-top: none;
}
.top_plan_item_head{
padding: 6.0rem 4.0rem 3.0rem;
}
.top_plan_item:first-child .top_plan_item_head{
padding-top: 3.0rem;
}
.top_plan_item_ttl{
font-size: 6.5rem;
}
.top_plan_item_ttl_sub{
font-size: 3.0rem;
}
.top_plan_item_price_wrap{
display: flex;
align-items: baseline;
margin: 2rem auto 2rem;
}
.top_plan_item_price_en{
font-size: 10.0rem;
}
.top_plan_item_price_jp{
font-size: 3.6rem;
}
.top_plan_item_price_jp2{
font-size: 2.8rem;
margin-left: 1.0rem;
}
ul.top_plan_txt_list{
min-height: 12rem;
}
ul.top_plan_txt_list li{
font-size: 2.6rem;
padding-left: 5.0rem;
background-size: 4.0rem auto;
margin: 0.5rem auto;
}
.top_plan_item_btm{
padding: 3rem 3rem;
margin-bottom: 4.0rem;
}
.top_plan_item_btm_inn{
  display: flex;
  justify-content: center;
  align-items: center;
  min-height: 30rem;
  border: solid 1px #d9d9d9;
  padding: 4.0rem 0;
  width: 90%;
  margin: 0 auto;
  border-radius: 3.0rem;
}
.top_plan_item_btm_txt{
font-size: 2.8rem;
text-align: center;
}
.top_plan_item_btm_txt span{
font-size: 2.6rem;
margin: 0.6rem auto;
}
}

/***** faq ****/
.accordion-header {
  padding: 12px 45px 10px 20px;
  margin: 10px 0 0;
  transition: background .3s ease;
  cursor: pointer;
  position: relative;
}
.accordion-header::before,
.accordion-header::after{
	position:absolute;
	content:'';
	top:1px;
	right:20px;
	bottom:0;
	width:15px;
	height:3px;
	margin:auto;
	background:#000;
}
.accordion-header::after{
	transform:rotate(-90deg);
	transition:transform 0.3s;
}
.accordion-header.active::after{transform:rotate(0deg);}
.accordion-content {
  display: none;
}
.accordion-content {
  padding: 12px 20px 10px;
  position: relative;
}
.accordion-content::before {
	content: '';
	width: 15px;
	height: 25px;
	position: absolute;
}
.accordion-content::before{
	border-left: solid 1px #000000;
	border-bottom: solid 1px #000000;
	top: 10px;
	left: 30px;
}

.accordion-header span,
.accordion-content span{
  padding-left: 4.0rem;
  position: relative;
  font-size: 1.9rem;
  font-weight: 700;
  display: inline-block;
}
.accordion-content span{
  padding-left: 8.0rem;
  font-weight: 500;
}
.accordion-header span::before{
  position: absolute;
  font-family: "Lexend", sans-serif;
  content:"Q";
  top: -0.3rem;
  left: 0;
  color: #000;
  font-size: 3.2rem;
  font-weight: 800;
  line-height: 1.0;
}
.accordion-content span::before{
    position: absolute;
    font-family: "Lexend", sans-serif;
  content:"A";
  top: -0.3rem;
  left: 4.0rem;
  color: #000;
  font-size: 3.2rem;
   font-weight: 800;
   line-height: 1.0;
}
@media screen and (max-width: 768px) {
.accordion-header {
  padding: 12px 45px 10px 20px;
  margin: 1.5rem 0 0;
  transition: background .3s ease;
  cursor: pointer;
  position: relative;
}
.accordion-header::before,
.accordion-header::after{
	top:1px;
	right:20px;
	bottom:0;
	width:15px;
	height:3px;
}
.accordion-header::after{
}
.accordion-content {
  display: none;
}
.accordion-content {
  padding: 5px 20px 10px;
  position: relative;
}
.accordion-content::before {
	content: '';
	width: 1.5rem;
	height: 2.5rem;
	position: absolute;
}
.accordion-content::before{
	border-left: solid 1px #000000;
	border-bottom: solid 1px #000000;
	top: 1.0rem;
	left: 5.0rem;
}
.accordion-header span,
.accordion-content span{
  padding-left: 5.0rem;
  font-size: 2.8rem;
}
.accordion-content span{
  padding-left: 10.0rem;
    font-size: 2.6rem;
}
.accordion-header span::before{
  top: 0rem;
  left: 0;
  font-size: 4.0rem;
}
.accordion-content span::before{
  top: 0rem;
  left: 5.0rem;
  font-size: 4.0rem;
}
}

/***** last ****/
.last_box{
width: 100%;
margin: 0 auto;
position: relative;
background: url("../img/bg_dot_gray.svg") top left repeat;
background-size: 10px auto;
padding-bottom: 3rem;
}
.top_last_wrap{
padding: 30rem 0 20rem;
text-align: center;
}
.top_last_messe{
font-size: 4.1rem;
font-weight: 800;
text-align: center;
}
.top_last_read{
font-size: 2.4rem;
text-align: center;
}
.foot_btn_wrap{
justify-content: center;
margin-top: 6rem;
}
.foot_logo_wrap{
display: flex;
justify-content: center;
align-items: center;
margin: 3rem auto;
}
.foot_logo_tko{
width: 100%;
max-width: 54px;
margin-bottom: 1.5rem;
}
.foot_logo_que{
width: 100%;
max-width: 58px;
margin: 0 3rem;
}
.foot_logo_p2{
width: 100%;
max-width: 120px;
}
.top_last_copy{
text-align: center;
font-size: 1.1rem;
}
@media screen and (max-width: 768px) {
.last_box{
padding-bottom: 5rem;
}
.top_last_wrap{
padding: 20rem 0 4rem;
text-align: center;
}
.top_last_messe{
font-size: 6.0rem;
}
.top_last_read{
font-size: 3.6rem;
margin-top: 3.0rem;
}
.foot_btn_wrap{
justify-content: center;
flex-direction: column;
align-items: center;
margin-top: 6rem;
}
.foot_btn_wrap .head_btn{
margin-top: 3.0rem;
width: 50%;
}
.foot_logo_wrap{
display: flex;
justify-content: center;
align-items: center;
margin: 3rem auto;
}
.foot_logo_tko{
width: 25%;
max-width: 54px;
margin-bottom: 1.5rem;
}
.foot_logo_que{
width: 25%;
max-width: 58px;
margin: 0 3rem;
}
.foot_logo_p2{
width: 25%;
max-width: 120px;
}
.top_last_copy{
font-size: 1.9rem;
}
}


/***** anime ****/
.anime {
    opacity : 0.01;
    transform : translate(0, 30px);
    transition : all 800ms;
    }
.anime.fadein {
    opacity : 1;
    transform : translate(0, 0);
    }

.logoshow {
    opacity : 1;
    transition : all 500ms;
    }
.logoshow.fadein {
    opacity : 0;
    }



/* ==========================================================================
   Helper classes
   ========================================================================== */

.pc-only{ display:inline;}
.sp-only{ display:none;}
.pc-b-only{ display: block;}
.sp-b-only{ display:none;}
@media screen and (max-width: 768px) {
.pc-only{ display:none;}
.sp-only{ display:inline;}
.pc-b-only{ display: none;}
.sp-b-only{ display:block;}
}
.visuallyhidden {
    border: 0;
    clip: rect(0 0 0 0);
    height: 1px;
    margin: -1px;
    overflow: hidden;
    padding: 0;
    position: absolute;
    width: 1px;
}

.visuallyhidden.focusable:active,
.visuallyhidden.focusable:focus {
    clip: auto;
    height: auto;
    margin: 0;
    overflow: visible;
    position: static;
    width: auto;
}

.invisible {
    visibility: hidden;
}

.clearfix:before,
.clearfix:after {
    content: " ";
    display: table;
}

.clearfix:after {
    clear: both;
}

.clearfix {
    *zoom: 1;
}



/* ヘッダー・ロゴエリア */
.header_logo_area {
  width: 100%;
  background-color: #ffffff; /* 背景色 */
  padding: 15px 20px;
  box-sizing: border-box;
  position: relative;
  z-index: 100;
  border-bottom: 1px solid #e5e5e5; /* 下ライン（不要なら削除可） */
}

.header_logo_inn {
  max-width: 1200px;
  margin: 0 auto;
  display: flex;
  align-items: center;
  justify-content: center; /* ← この行を追加（中央揃えになります） */
  gap: 15px;
}

.header_logo_link {
  display: inline-flex;
  align-items: center;
  text-decoration: none;
}

.header_logo_img {
  height: 50px; /* PCでのロゴの高さ（見栄えに合わせて調整してください） */
  width: auto;
  display: block;
}

/* ロゴ間の「×」などの区切り記号 */
.header_logo_sep {
  font-size: 14px;
  color: #888888;
  font-weight: bold;
}

/* スマホ表示時の調整 */
@media screen and (max-width: 768px) {
  .header_logo_area {
    padding: 10px 15px;
  }
  
  .header_logo_inn {
    gap: 10px; /* スマホ時のロゴ間隔 */
  }

  .header_logo_img {
    height: 50px; /* スマホでのロゴの高さ */
  }

  .header_logo_sep {
    font-size: 12px;
  }
}



/* ===================================
   Movie セクション全体のスタイル
=================================== */

/* セクション外枠 */
.sec_wrap_movie {
  text-align: center;
  padding: 60px 20px;
}

/* 動画一覧のコンテナ（1〜3個でも自動で中央配置） */
.movie_list {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 24px;
  max-width: 960px;
  margin: 30px auto 0;
}

/* 動画1つ分のブロック（カードサイズを300pxに制限） */
.movie_item {
  display: block;
  text-decoration: none;
  color: #333;
  width: 100%;
  max-width: 300px; /* ここでサムネイルが大きくなりすぎるのを防いでいます */
  box-sizing: border-box;
  transition: transform 0.3s ease;
}

.movie_item:hover {
  transform: translateY(-4px);
}

/* サムネイル画像枠 (16:9の比率を保持) */
.movie_thumb_wrap {
  position: relative;
  width: 100%;
  padding-top: 56.25%; /* 16:9 */
  overflow: hidden;
  border-radius: 12px;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.12);
  background-color: #000;
}

/* サムネイル画像 */
.movie_thumb_img {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: opacity 0.3s ease;
}

.movie_item:hover .movie_thumb_img {
  opacity: 0.9;
}

/* 再生ボタンアイコン */
.movie_play_btn {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 48px;
  height: 34px;
  background-color: rgba(255, 0, 0, 0.9);
  border-radius: 8px;
  transition: background-color 0.3s ease, transform 0.3s ease;
}

.movie_play_btn::after {
  content: "";
  position: absolute;
  top: 50%;
  left: 54%;
  transform: translate(-50%, -50%);
  border-style: solid;
  border-width: 7px 0 7px 12px;
  border-color: transparent transparent transparent #ffffff;
}

.movie_item:hover .movie_play_btn {
  background-color: #ff0000;
  transform: translate(-50%, -50%) scale(1.1);
}

/* 動画タイトルテキスト */
.movie_title {
  margin-top: 10px;
  font-size: 14px;
  font-weight: bold;
  line-height: 1.4;
  text-align: left;
}

/* スマホ表示時の調整 (768px以下) */
@media screen and (max-width: 768px) {
  .movie_item {
    max-width: 100%; /* スマホでは画面幅に合わせて見やすく伸縮 */
  }
}


/* 英文タイトル（サイズ微調整版） */
.ttl_en_movie {
  color: #337ab7;            /* Approach画像と同系統のブルー */
  font-family: 'Noto Sans JP', sans-serif; /* サイト指定フォント */
  font-weight: 700;          /* 太字 */
  font-size: 22px;           /* サイズを小さく調整 (22px) */
  line-height: 1;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;                  /* 丸と文字の間隔 */
  margin-bottom: 8px;        /* 下の要素との余白 */
}

/* 文字左側の青い丸記号 */
.ttl_en_movie::before {
  content: "";
  display: inline-block;
  width: 10px;               /* 丸のサイズも小さく調整 */
  height: 10px;
  background-color: #337ab7;
  border-radius: 50%;
}

/* スマホ表示時 (768px以下) のサイズ調整 */
@media screen and (max-width: 768px) {
  .ttl_en_movie {
    font-size: 18px;         /* スマホではさらに一回り小さく */
  }
  .ttl_en_movie::before {
    width: 8px;
    height: 8px;
  }
}

/* 英語見出しタイトルの共通共通共通スタイル */
.sec_ttl_en {
  color: #337ab7;                   /* ブランドカラーのブルー */
  font-family: 'Noto Sans JP', sans-serif;
  font-weight: 700;                 /* 太字 */
  font-size: 22px;                  /* テキストサイズ */
  line-height: 1;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;                         /* 丸記号とテキストの間隔 */
  margin-bottom: 12px;
  text-align: center;
}

/* 左側の青い丸記号 */
.sec_ttl_en::before {
  content: "";
  display: inline-block;
  width: 10px;
  height: 10px;
  background-color: #337ab7;
  border-radius: 50%;
}

/* スマホ表示時 (768px以下) */
@media screen and (max-width: 768px) {
  .sec_ttl_en {
    font-size: 18px;
  }
  .sec_ttl_en::before {
    width: 8px;
    height: 8px;
  }
}

/* スマホ表示時のフロートバナー文字切れ修正 */
@media screen and (max-width: 768px) {
  .float_bnn_inn {
    padding: 1.5rem 2.0rem; /* 内側の余白を詰める */
  }

  .float_bnn_ttl {
    font-size: 2.8rem;       /* 8文字（より詳しくはこちら）が入るように微調整 */
    margin: 0 0 0 1.2rem;    /* アイコンとの間隔 */
    white-space: nowrap;     /* 文字切れ・改行を防止 */
  }
}