@charset "UTF-8";

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

custom_style

---------------------------------------- */
/* header */
.header-background{
	-webkit-transform: translateY(0);
	transform: translateY(0);
}

/* wrapper */
.wrapper-background>.wrapper{
	padding-top:70px;
}

@media screen and (min-width: 0px) and (max-width: 767px){
	.wrapper-background>.wrapper{
		padding-top:0;
	}
}


/* section */
.wrapper .section-wrapper>section{
	background-color:#ffffff;
}

.wrapper .heading-center{
	margin-top:50px;
	margin-bottom:60px;
}

.wrapper #hint section article{
	margin-top:-70px;
	padding-top:70px;
}

.wrapper #hint section article h2{
	position:relative;
	margin:50px auto 46px auto;
/* 	border:solid 0.1072rem #e86500; */
	border:solid 0.1072rem #727171;
	border-radius:30px;
	max-width:600px;
	padding:6px 20px 10px 20px;
	text-align:center;
	font-size:1.63rem;
	letter-spacing: 0.1em;
}

.wrapper #hint section article#hint1 h2,
.wrapper #hint section article#hint1-2 h2{
	border-color:#ffffff;
	background-color:#9ff40b;
/* 	color:inherit; */
}

.wrapper #hint section article#hint1 h2:before,
.wrapper #hint section article#hint1-2 h2:before{
	content:"";
	position:absolute;
	bottom:-27px;
	left:50%;
	margin-left:-17px;
	border:14px solid transparent;
	border-top:14px solid #9ff40b;
	z-index:2;
}

.wrapper #hint section article#hint1 h2:after,
.wrapper #hint section article#hint1-2 h2:after{
	content:"";
	position:absolute;
	bottom:-30px;
	left:50%;
	margin-left:-18px;
	border:15px solid transparent;
	border-top:15px solid #ffffff;
	z-index:1;
}

.wrapper #hint section article#hint2 h2{
	margin-top:30px;
	border-color:#ffffff;
	background-color:#9ff40b;
	color:#000000;
}

.wrapper #hint section article#hint2 h2:before{
	content:"";
	position:absolute;
	bottom:-27px;
	left:50%;
	margin-left:-17px;
	border:14px solid transparent;
	border-top:14px solid #9ff40b;
	z-index:2;
}

.wrapper #hint section article#hint2 h2:after{
	content:"";
	position:absolute;
	bottom:-30px;
	left:50%;
	margin-left:-18px;
	border:15px solid transparent;
	border-top:15px solid #ffffff;
	z-index:1;
}

.wrapper #hint section article#hint3 h2{
	margin-top:30px;
	border-color:#ffffff;
	background-color:#9ff40b;
	color:#000000;
}

.wrapper #hint section article#hint3 h2:before{
	content:"";
	position:absolute;
	bottom:-27px;
	left:50%;
	margin-left:-17px;
	border:14px solid transparent;
	border-top:14px solid #9ff40b;
	z-index:2;
}

.wrapper #hint section article#hint3 h2:after{
	content:"";
	position:absolute;
	bottom:-30px;
	left:50%;
	margin-left:-18px;
	border:15px solid transparent;
	border-top:15px solid #ffffff;
	z-index:1;
}

@media screen and (min-width: 0px) and (max-width: 767px){
	.wrapper #hint section article h2{
		padding:15px 20px 20px 20px;
		letter-spacing: 0.05em;
	}
}

.wrapper #hint section article#hint1 .note,
.wrapper #hint section article#hint1-2 .note{
	font-size:0.94rem;
}

.wrapper #hint section article#hint2 .lead{
	margin:0 auto 75px auto;
	max-width:775px;
	font-size:1.0rem;
}

.wrapper #hint section article#hint2 .note{
	font-size:0.94rem;
}

.wrapper #hint section article#hint2 .col-left{
}

.wrapper #hint section article#hint2 .col-right{
}

.wrapper #hint section article#hint2 .col-left img{
	width:100%;
	max-width:132px;
}

.wrapper #hint section article#hint2 .text-large{
	line-height:1.6em;
	font-size:1.5rem;
	font-weight:500;
}

@media screen and (min-width: 0px) and (max-width: 767px){
	.wrapper #hint section article#hint2 .col-left{
		padding-right:0;
	}

	.wrapper #hint section article#hint2 .col-right .text-large{
		font-size:1.19rem;
	}
}

.wrapper #hint section article#hint3 h3.technic{
	position:relative;
	margin:50px auto 46px auto;
	border:solid 0.1072rem #ffffff;
	border-radius:30px;
	max-width:400px;
	padding:4px 20px 8px 20px;
	text-align:center;
	font-size:1.63rem;
	letter-spacing: 0.1em;
	background-color:#9ff40b;
	color:#000000;
	font-weight:500;
}

.wrapper #hint section article#hint3 .col-left img{
	width:100%;
	max-width:133px;
}

.wrapper #hint section article#hint3 .text-large{
	margin-top:3.4vw;
	line-height:1.6em;
	font-size:1.5rem;
	font-weight:500;
}

.wrapper #hint section article#hint3 .text-large small{
	font-size:1.0rem;
}

.wrapper #hint section article#hint3 .technic01-1{padding:0 15px;
	width:54.5%;
	max-width:465px;
}

.wrapper #hint section article#hint3 .technic01-2{
	width:45.4%;
	max-width:388px;
}

.wrapper #hint section article#hint3 .technic02-1{padding:0 15px;
	width:62.7%;
	max-width:535px;
}

.wrapper #hint section article#hint3 .technic02-2{
	width:37.2%;
	max-width:318px;
}

.wrapper #hint section article#hint3 .card-future{
	border:solid 2px #9ff40b;
	border-radius:30px;
}

.wrapper #hint section article#hint3 .card-future .card-header{
	border-bottom:none;
	border-radius:28px 28px 0 0;
	background-color:#9ff40b;
	padding:20px;
}

.wrapper #hint section article#hint3 .card-future .card-body{
	padding:70px 75px 30px 75px;
}

.wrapper #hint section article#hint3 h3.future{
	margin:0;
	padding:0;
	color:#000000;
	text-align:center;
	font-size:1.63rem;
	letter-spacing: 0.1em;
	font-weight:600;
}

.wrapper #hint section article#hint3 .card-future .col-left img{
	width:100%;
	max-width:235px;
}


@media screen and (min-width: 0px) and (max-width: 991px){
	.wrapper #hint section article#hint3 .text-large{
		margin-top:5vw;
	}

	.wrapper #hint section article#hint3 .technic01-1,
	.wrapper #hint section article#hint3 .technic01-2,
	.wrapper #hint section article#hint3 .technic02-1,
	.wrapper #hint section article#hint3 .technic02-2{
		width:100%;
	}

	.wrapper #hint section article#hint3 .card-future .card-body{
		padding:30px 30px;
	}

}

@media screen and (min-width: 0px) and (max-width: 767px){
	.wrapper #hint section article#hint3 .col-left{
		padding-right:0;
	}

	.wrapper #hint section article#hint3 .text-large{
		margin-top:6vw;
	}

}


@media screen and (min-width: 0px) and (max-width: 575px){
	.wrapper #hint section article#hint3 .text-large{
		font-size:1.34rem;
	}

	.wrapper #hint section article#hint3 .card-future .card-body{
		padding:20px 15px;
	}
}

.wrapper #hint a.modal-v-btn{
	display:block;
	position:relative;
	outline:none;
}


/* .closing-date */
.wrapper #hint .closing-date{
	padding-top:30px;
	padding-bottom:25px;
}

.wrapper #hint .closing-date h3{
	margin:0 auto;
	padding-bottom:5px;
	color:#000000;
	letter-spacing:0.1em;
	text-indent:0.1em;
	font-size:1.63rem;
}

.wrapper #hint .closing-date p{
	margin-bottom:;
	padding-bottom:10px;
	font-size:1.75rem;
	font-weight:bold;
	line-height:1.6em;
}

.wrapper #hint .closing-date .large{
	font-size:1.44em;
}

.wrapper #hint .closing-date a.btn{
	position:relative;
	width:100%;
	max-width:400px;
	border:solid 2px #6743e6;
	border-radius:10px;
	background-color:#ff4200;
	padding:25px;
	font-size:1.44em;
	font-weight:bold;
	font-family:"Noto Sans JP","Hiragino Kaku Gothic Pro","メイリオ",Meiryo,sans-serif;
	color:#ffffff;
}

.wrapper #hint .closing-date .btn .fas{
	position:absolute;
	right:0;
	top:0;
	padding:25px 10px;
	line-height:1.44em;
}