@charset "utf-8";
/* CSS Document */


/*@media screen and (max-width: 639px) {*/

.contentsWidth .MB10 { margin-bottom:6px; }
.contentsWidth .MB20 { margin-bottom:12px; }
.contentsWidth .MB30 { margin-bottom:18px; }
.contentsWidth .MB40 { margin-bottom:24px; }
.contentsWidth .MB50 { margin-bottom:30px; }
.contentsWidth .MB80 { margin-bottom:48px; }
.contentsWidth .MT10 { margin-top:6px; }
.contentsWidth .MT20 { margin-top:12px; }
.contentsWidth .MT30 { margin-top:18px; }
.contentsWidth .MT40 { margin-top:24px; }
.contentsWidth .MT50 { margin-top:30px; }
.pconly { display:none; }
.sponly { display:block; }
br.pconly { display:none; }
br.sponly { display:inherit; }

.contentsWidth section { margin-bottom: 60px; }

/* [ movie ] */
.contentsWidth .movie_box { justify-content: space-between !important;}
.contentsWidth .movie_box.col2 > *,
.contentsWidth .movie_box.col3 > * { width: calc(50% - 5px); }
.contentsWidth .movie_box > *:nth-child(2) ~ * { margin-top: 20px; }
.contentsWidth .movie_box.col3 > * { margin-left: 0; }

/* [ modal ] */
.modal_box {
	margin: 10px 0;
	padding: 20px 10px !important;
}
.modal_box h3 {
	padding: 0 30px;
	font-size: 1.8rem;
}

.contentsWidth .lineup_box { font-size: 1.6rem; }

.contentsWidth .feature_box h3.feature_btn {
  padding: 10px;
  font-size: 18px;
}
.contentsWidth .feature_box h3.feature_btn span {
display: block;
background: url("../img/lineup_list_btn_o.svg") no-repeat right center;
background-size: 70px auto;
padding:0 75px 0 0;
text-align: left;
}
.contentsWidth .feature_box h3.feature_btn.active span {
display: block;
background: url("../img/lineup_list_btn_c.svg") no-repeat right center;
background-size: 70px auto;
padding:0 75px 0 0;
text-align: left;
}





.contentsWidth .lineup_box ul.lineup_btn li {
width: 33.3%;
}
.contentsWidth .feature_box .feature_ct {
padding-top:15px;
}

.contentsWidth .feature_box .feature_ct .feature_flexbox {
display: block;
}

.contentsWidth .feature_box .feature_ct .feature_flexbox .feature_eachbox {
	width: 90%;
	max-width: 400px;
	margin: 0 auto 30px;
}
.contentsWidth .feature_box .feature_ct .feature_flexbox .feature_eachbox img {
display: block;
margin: 0 auto 10px;
height: auto;
}
.contentsWidth .feature_box .feature_ct .feature_flexbox::after{
display: none;
}
.contentsWidth .feature_box .feature_ct .feature_flexbox .feature_eachbox h4 {
font-size: 18px;
margin-bottom: 12px;
}

.contentsWidth .chirp_box {
padding: 15px;
}
.contentsWidth .chirp_box .feature01 {
margin-bottom: 15px;
}
.contentsWidth .chirp_box .feature01 p {
float: none;
width: 100%;
margin-bottom: 10px;
}
.contentsWidth .chirp_box .feature01 a {
font-size: 24px;
line-height: 1.2;
margin-bottom: 15px;
}
.contentsWidth .chirp_box .feature01 img {
display: block;
float: none;
width: 80%;
margin: 0 auto 20px;
}

.contentsWidth h2.bottom_border {
  border-bottom: solid 3px #b4b4b4;
  position: relative;
font-family: 'Noto Sans JP', sans-serif;
font-weight: 900;
font-size: 28px;
color:#132B54;
padding-bottom: 5px;
}

.contentsWidth h2.bottom_border {
font-weight: 900;
font-size: 24px;
}

.contentsWidth .series_feature_box {
display: block;
}
.contentsWidth .series_feature_box>a {
display: block;
width: 100%;
}
.contentsWidth .series_feature_box>a:nth-child(2n){
background: #DFE8ED;
}
.contentsWidth .series_feature_box>a:nth-child(3),
.contentsWidth .series_feature_box>a:nth-child(7) {
background: #F0EEEE;
}
.contentsWidth .series_feature_box>a img {
width: 40%;
}
.contentsWidth .series_feature_box>a p {
width: 60%;
padding: 15px 10px 10px 0;
}


/* [ Simulation Bunner ] */
.contentsWidth .simulation_bunner a {
	padding: 12px 12px 12px 30px;
	border-width: 3px;
  background-image: none;
}
.contentsWidth .simulation_bunner a::before {
	left: 0;
	width: 14px;
	height: 14px;
	margin-top: -7px;
	border-top-width: 3px;
	border-right-width: 3px;
}
.contentsWidth .simulation_bunner b { font-size: 1.5rem; }
.contentsWidth .simulation_bunner span {
	font-size: 1.2rem;
}
.contentsWidth .simulation_bunner br { display: none; }


.contentsWidth .sec_ttl b {
	margin-left: 5px;
	padding: 10px 15px 5px 15px;
	font-size: 2rem;
}
.contentsWidth .sub_ttl { font-size: 1.8rem; }
.contentsWidth .feature_lead_txt { font-size: 1.5rem; }
.contentsWidth .feature_lead_txt + p { text-align: center; }

.contentsWidth .feature_extension_btnbox { padding: 20px 15px; }
.contentsWidth .feature_extension_btnbox a {
	width: calc(50% - 5px);
	height: 60px;
}
.contentsWidth .feature_extension_btnbox a b { padding: 10px 32px 10px 0; }
.contentsWidth .feature_extension_btnbox a:nth-child(2) ~ a { margin-top: 10px; }


.contentsWidth .guide {
padding: 30px 10px;
margin-right: -10px;
margin-left: -10px;
}

.contentsWidth .guide_each_box {
background: #fff;
padding: 15px;
}
.contentsWidth .guide_each_box .guide_each_ttl,
.contentsWidth .guide_each_box .guide_each_ttl.ttl01,
.contentsWidth .guide_each_box .guide_each_ttl.ttl02,
.contentsWidth .guide_each_box .guide_each_ttl.ttl03,
.contentsWidth .guide_each_box .guide_each_ttl.ttl04 {
	color:#003565;
	font-weight: bold;
	font-size: 2rem;
	padding-left: 0px;
	height:inherit;
	margin-bottom: 20px;
	background: none;

	-webkit-align-items: center;
	align-items: center;
}
.contentsWidth .guide_each_box .guide_each_ttl span {
	width: calc(100% - 60px) !important;
	display: block;
}
.contentsWidth .guide_each_box .guide_each_ttl:before {
	width: 50px;
	height: auto;
	margin:0 10px 0 0;
}
.contentsWidth .guide_each_box .guide_each_ttl.ttl01:before { content: url("../img/guide_ttl_step1.svg"); }
.contentsWidth .guide_each_box .guide_each_ttl.ttl02:before { content: url("../img/guide_ttl_step2.svg"); }
.contentsWidth .guide_each_box .guide_each_ttl.ttl03:before { content: url("../img/guide_ttl_step3.svg"); }
.contentsWidth .guide_each_box .guide_each_ttl.ttl04:before { content: url("../img/guide_ttl_step4.svg"); }

.contentsWidth .guide_each_box .guide_each_inbox{ display: block; }
.contentsWidth .guide_each_box .guide_each_inbox>*{
	display: block;
	margin:0 auto 15px;
	width: 100%;
}
.contentsWidth .guide_each_box .guide_each_inbox>* ul { margin-left: 0; }

.contentsWidth .guide_each_box .guide_point_txt{
	font-size: 1.8rem;
	margin: 10px auto 20px;
	max-width: 600px;
	padding: 5px 10px;
	height:inherit;
	text-align: center;
}

.contentsWidth .guide_each_box .guide_img01_2{
max-width: 354px;
height: auto;
}
.contentsWidth .guide_each_box .guide_each_inbox.inbox02 img{
width: 100%;
text-align: center;
}

.contentsWidth .guide_dl_box{
display: block;
}
.contentsWidth .guide_dl_box a{
width: 100%;
max-width: 400px;
font-size: 14px;
margin: 0 auto 10px;
padding: 10px;
}


.contentsWidth .guide03_likebox { display: block; }

.contentsWidth .guide03_likebox .guide03_like_eachbox {
width: 90%;
max-width: 400px;
margin:0 auto 20px;
}
.contentsWidth .guide03_likebox .guide03_like_eachbox:last-of-type {
margin-bottom: 0;
}

.contentsWidth .guide_note_box {
	padding: 15px;
	font-size: 1.2rem;
}

.contentsWidth .support_link a{
display: block;
background: #003565;
max-width: 400px;
margin: 0 auto;
padding: 20px 10px;
color:#fff;
font-size: 15px;
font-weight: bold;

box-sizing: border-box;
}


/*--------------------------------*/


@media (max-width: 479px) {
	/* [ movie ] */
	.contentsWidth .movie_box { display: block; }
	.contentsWidth .movie_box.col2 > *, 
	.contentsWidth .movie_box.col3 > * {
		width: 80%;
		max-width: 475px;
		margin: 0 auto 15px !important;
	}
	.contentsWidth .movie_box > *:nth-child(1) ~ * { margin-top: 20px !important; }

	/* [ feature_sonar_btnbox ] */
	.contentsWidth .feature_sonar_btnbox { display: block; }
	.contentsWidth .feature_sonar_btnbox a{
		display: block;
		width: 80%;
		max-width: 475px;
		margin:0 auto 15px;
	}

	/* [ feature_extension_btnbox ] */
	.contentsWidth .feature_extension_btnbox { display: block; }
	.contentsWidth .feature_extension_btnbox a {
		width: 80%;
		max-width: 475px;
		margin:0 auto;
	}
	.contentsWidth .feature_extension_btnbox a:nth-child(1) ~ a { margin-top: 10px; }
/*max-width: 479px*/}

