@charset "utf-8";

/*
#################################
 
	webフォント読み込み
 
#################################
*/
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@100..900&family=Noto+Serif+JP:wght@200..900&display=swap');

/*
#################################
 
	全体
 
#################################
*/
html{
	font-size:62.5%;
}
body{
	font-family: "Noto Serif JP", serif;
	font-optical-sizing: auto;
	font-weight: 500;
	font-style: normal;
	font-size:2rem;
	line-height:2;
	letter-spacing:0.05em;
	color:#333;
	background:#fff;
}

.gothic{
	font-family: "Noto Sans JP", serif;
	font-optical-sizing: auto;
	font-weight: 500;
	font-style: normal;
}
.mincho{
	font-family: "Noto Serif JP", serif;
	font-optical-sizing: auto;
	font-weight: 500;
	font-style: normal;
}



.wrap{
	max-width:1100px;
	margin:0 auto;
}
@media screen and (max-width:768px){
	.wrap{
		padding:0 15px;
		box-sizing:border-box;
	}
}

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

input[type="text"]{
	margin: 0;
	padding: 0;
	background: none;
	border: none;
	border-radius: 0;
	outline: none;
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
}
button{
	background-color: transparent;
	border: none;
	cursor: pointer;
	outline: none;
	padding: 0;
	appearance: none;
}

.pc{
	display:block;
}
.sp{
	display:none;
}
@media screen and (max-width:768px){
	.pc{
		display:none;
	}
	.sp{
		display:block;
	}
}
/*
#################################
 
	header
 
#################################
*/
#header{
	background:#846623;
	height:80px;
	padding:0 24px;
	box-sizing:border-box;
	display:-webkit-flex;
	display:-moz-flex;
	display:-ms-flex;
	display:-o-flex;
	display:flex;
	-webkit-flex-wrap:wrap;
	flex-wrap:wrap;
	align-items: center;
	-webkit-align-items: center;
}
@media screen and (max-width:768px){
	#header{
		height:50px;
		padding:0 16px;
		box-sizing:border-box;
	}
}
.brand{
	width:200px;
	display:block;
}
@media screen and (max-width:768px){
	.brand{
		width:120px;
		display:block;
	}
}
.brand img{
	width:100%;
	height:auto;
}

/*
#################################
 
	main
 
#################################
*/
.main{
	background:url('../images/main_bg.jpg')no-repeat;
	background-position:center center;
	background-size:cover;
	padding:24px 0 32px;
}
.main_img{
	max-width:510px;
	width:100%;
	margin-left:auto;
}
.breaking_news{
	background:#ECE6C8;
	border-top:#846623 3px solid;
	border-bottom:#846623 3px solid;
	padding:8px 0;
}

.breaking_news--ttl{
	color:#333;
	font-size:1.6rem;
	font-weight:600;
	padding:0 40px;
	box-sizing:border-box;
}
@media screen and (max-width:768px){
	.breaking_news--ttl{
		display:block;
		padding:0 10px;
		text-align:center;
		box-sizing:border-box;
	}
}
.breaking_news--brand{
	color:#333;
	font-size:1.6rem;
	font-weight:600;
}
@media screen and (max-width:768px){
	.breaking_news--brand{
		font-weight:600;
		display:block;
		text-align:center;
	}
}
.breaking_news--result{
	font-size:2rem;
	font-weight:600;
	margin-left:40px;
	color:#846623;
}
@media screen and (max-width:768px){
	.breaking_news--result{
		display:block;
		text-align:center;
		margin-left:0;
	}
}






/*
#################################
 
	regist
 
#################################
*/
.regist{
	background:url('../images/regist_bg.jpg')no-repeat;
	background-position:center center;
	background-size:cover;
	padding:32px 0;
	border-bottom:#846623 3px solid;
}
.regist--second,
.regist--third{
	border-top:#846623 3px solid;
}
.regist_ttl{
	text-align:center;
	color:#846623;
	font-size:2rem;
	line-height:1.6;
}
.regist_txt{
	text-align:center;
	color:#333;
	font-size:2.4rem;
	line-height:1.6;

}
.regist_input{


}
.regist_input .form_input{
	background:#fff;
	border:#330B15 1px solid;
	border-radius:5px;
	height:50px;
	line-height:50px;
	text-align:center;
	font-size:1.6rem;
	display:block;
	width:100%;
	max-width:500px;
	margin:16px auto 0;
}

.form_submit{
	display:block;
	max-width:450px;
	margin:16px auto 0;
}
.regist_check{
	text-align:center;
	font-size:1.2rem;
	margin-top:8px;
}
.regist_note{
	max-width:620px;
	width:100%;
	margin:8px auto 0;
}


/*
#################################
 
	results
 
#################################
*/
.sec--results{
	margin-top:80px;
}
@media screen and (max-width:768px){
	.sec--results{
		margin-top:40px;
	}
}
.section{
	padding:40px 0;
}
@media screen and (max-width:768px){
	.section{
		padding:24px 0;
	}
}
.section_ttl{
	text-align:center;
	font-size:3rem;
}
@media screen and (max-width:768px){
	.section_ttl{
		font-size:2.4rem;
	}
}
.section_ttl.ttl--color2{
	color:#846623;
}
.section_ttl.ttl--margin{
	margin-top:40px;
}
@media screen and (max-width:768px){
	.section_ttl.ttl--margin{
		margin-top:24px;
	}
}
.results{
	margin-top:48px;
	display:-webkit-flex;
	display:-moz-flex;
	display:-ms-flex;
	display:-o-flex;
	display:flex;
	-webkit-flex-wrap:wrap;
	flex-wrap:wrap;
	-webkit-justify-content:space-around;
	justify-content:space-around;
}
@media screen and (max-width:768px){
	.results{
		margin-top:24px;
	}
}
.result_item{
	max-width:450px;
	width:100%;
	margin-bottom:40px;
}
@media screen and (max-width:768px){
	.result_item{
		margin-bottom:24px;
	}
}
.result_ttl{
	background:#846623;
	color:#fff;
	padding:8px 16px;
	box-sizing:border-box;
	line-height:1.4;
}
.result_code{
	font-size:1.6rem;
	border-right:#fff 1px solid;
	padding-right:16px;
}
.result_name{
	font-size:1.6rem;
	padding-left:16px;
}
.result_data{
	font-size:1.4rem;
	padding:8px 0;
	border-bottom:#CCCCCC 1px solid;
}
.data_head{
	background:#666666;
	color:#fff;
	font-size:1.4rem;
	display:inline-block;
	width:90px;
	text-align:center;
	margin-right:20px;
}
.data_strong{
	color:#A80000;
	font-size:2rem;
	
}
.sec_text1{
	text-align:center;
	font-size:2.4rem;
	line-height:1.6;
	margin-top:30px;
}
@media screen and (max-width:768px){
	.sec_text1{
		font-size:2rem;
		margin-top:16px;
	}
}
.sec_text1 span{
	color:#846623;
}
.sec_img1{
	width:75px;
	margin:32px auto 0;
}


/*
#################################
 
	sec--head1
 
#################################
*/
.sec--head1,
.sec--head2{
	background:url('../images/head_bg.png')no-repeat;
	background-position:center center;
	background-size:cover;
	padding:24px 0;
	text-align:center;
}
@media screen and (max-width:768px){
	.sec--head1,
	.sec--head2{
		background:url('../images/head_bg.png')no-repeat;
		background-position:center center;
		background-size:cover;
		padding:16px 0;
		text-align:center;
	}
}
.sec--head2{
	margin-top:80px;
}
@media screen and (max-width:768px){
	.sec--head2{
		margin-top:40px;
	}
}
.head1_txt{
	display:inline-block;
	height:32px;
	line-height:32px;
	font-size:1.8rem;
	background:#fff;
	padding:0 24px;
	border-radius:16px;
	color:#846623;
}
@media screen and (max-width:768px){
	.head1_txt{
		font-size:1.4rem;
	}
}
.head1_ttl{
	color:#fff;
	font-size:5rem;
	line-height:1.6;
}
@media screen and (max-width:768px){
	.head1_ttl{
		font-size:3rem;
	}
}
.head2_ttl{
	font-size:3rem;
	color:#fff;
}
@media screen and (max-width:768px){
	.head2_ttl{
		font-size:2rem;
	}
}
/*
#################################
 
	sec--person
 
#################################
*/
.sec--person{
	background:url('../images/reason_bg.jpg')no-repeat;
	background-position:center center;
	background-size:cover;
	padding:30px 0;
}
@media screen and (max-width:768px){
	.sec--person{
		padding:16px 0;
		background:#FFFEF8;
	}
}
.person_box{
	width:50%;
	padding:0 20px;
	box-sizing:border-box;
}
@media screen and (max-width:768px){
	.person_box{
		width:100%;
		padding:0 8px;
		box-sizing:border-box;
	}
}
.person_box h3{
	font-size:2.4rem;
	margin:16px 0;
	line-height:1.6;
}
@media screen and (max-width:768px){
	.person_box h3{
		font-size:2rem;
		margin:16px 0;
		line-height:1.6;
	}
}
.person_box p{
	font-size:1.6rem;
}
@media screen and (max-width:768px){
	.person_box p{
		font-size:1.4rem;
	}
}
.person_box p span{
	color:#846623;
}

.person_box2{
	display:-webkit-flex;
	display:-moz-flex;
	display:-ms-flex;
	display:-o-flex;
	display:flex;
	-webkit-flex-wrap:wrap;
	flex-wrap:wrap;
	-webkit-justify-content:space-between;
	justify-content: space-between;
	width:600px;
	margin:0 auto;
}
@media screen and (max-width:768px){
	.person_box2{
		width:100%;
	}
}
.person_box2 img{
	width:280px;
	height:auto;
}
@media screen and (max-width:768px){
	.person_box2 img{
		width:49%;
		height:auto;
	}
}
.person_txt{
	font-size:2.4rem;
	color:#846623;
	text-align:center;
	margin-top:24px;
}
@media screen and (max-width:768px){
	.person_txt{
		font-size:2rem;
		margin-top:16px;
	}
}
.person_txt2{
	width:650px;
	border-top:#846623 2px double;
	border-bottom:#846623 2px double;
	color:#333333;
	font-size:3rem;
	text-align:center;
	padding:24px 10px;
	box-sizing:border-box;
	margin:40px auto 0;	
	line-height:1.6;
}
@media screen and (max-width:768px){
	.person_txt2{
		width:100%;
		font-size:2.2rem;
		text-align:center;
		padding:24px 10px;
		box-sizing:border-box;
		margin:24px auto 0;	
		line-height:1.6;
	}
}
/*
#################################
 
	main2
 
#################################
*/
.main2{
	background:url('../images/main2_bg.jpg')no-repeat;
	background-position:center center;
	background-size:cover;
	height:400px;
}
@media screen and (max-width:768px){
	.main2{
		background:url('../images/main2_bg.jpg')no-repeat;
		background-position:left center;
		background-size:cover;
		height:240px;
	}
}
/*
#################################
 
	flow
 
#################################
*/
.flow_box{
	width:750px;
	margin:40px auto 0;
	border:#846623 1px solid;
	box-sizing:border-box;
	padding:30px;
	box-sizing:border-box;
}
@media screen and (max-width:768px){
	.flow_box{
		width:100%;
		margin:24px auto 0;
		padding:16px;
		box-sizing:border-box;
	}
}
.flow_box_ttl{
	text-align:center;
	font-size:2.2rem;
}
@media screen and (max-width:768px){
	.flow_box_ttl{
		font-size:1.8rem;
	}
}
.flow_box_inr{
	display:-webkit-flex;
	display:-moz-flex;
	display:-ms-flex;
	display:-o-flex;
	display:flex;
	-webkit-flex-wrap:wrap;
	flex-wrap:wrap;
	-webkit-justify-content:space-between;
	justify-content: space-between;
	margin-top:16px;
}
@media screen and (max-width:768px){
	.flow_box_inr{
		margin-top:8px;
	}
}
.flow_box_img{
	width:30%;
}
@media screen and (max-width:768px){
	.flow_box_img{
		width:50%;
		margin:8px auto 0;
	}
}
.flow_box_inr p{
	width:68%;
	font-size:1.4rem;
}
@media screen and (max-width:768px){
	.flow_box_inr p{
		width:100%;
		font-size:1.4rem;
	}
}
.flow_text{
	text-align:center;
	margin-top:16px;
}

.flow_text2{
	text-align:center;
	color:#846623;
	font-size:2.4rem;
	margin-top:40px;
}
@media screen and (max-width:768px){
	.flow_text2{
		font-size:2rem;
		margin-top:24px;
	}
}
.flow_text3{
	text-align:center;
	font-size:1.8rem;
	color:#333;
	margin-top:32px;
}
@media screen and (max-width:768px){
	.flow_text3{
		font-size:1.6rem;
		margin-top:16px;
	}

}
/*
#################################
 
	service
 
#################################
*/
.service_unit{
	margin-top:24px;
	display:-webkit-flex;
	display:-moz-flex;
	display:-ms-flex;
	display:-o-flex;
	display:flex;
	-webkit-flex-wrap:wrap;
	flex-wrap:wrap;
	-webkit-justify-content:space-around;
	justify-content:space-around;
}
.service_box{
	max-width:500px;
	width:100%;
	border:#846623 1px solid;
	padding:20px;
	box-sizing:border-box;
	min-height:390px;
	margin-bottom:24px;
}

.service_box_ttl{
	text-align:center;
	color:#846623;
	font-size:2.6rem;
	line-height:1.6;
}
@media screen and (max-width:768px){
	.service_box_ttl{
		font-size:2rem;
		line-height:1.6;
	}
}
.service_box_ttl small{
	display:block;
	font-size:1.8rem;
}
@media screen and (max-width:768px){
	.service_box_ttl small{
		display:block;
		font-size:1.6rem;
	}
}
.service_box_img{
	margin-top:8px;
}
.service_box_txt{
	font-size:1.6rem;
	margin-top:16px;
}
/*
#################################
 
	charm
 
#################################
*/
.charm_text{
	text-align:center;
	font-size:1.8rem;
	margin-top:16px;
}
@media screen and (max-width:768px){
	.charm_text{
		font-size:1.6rem;
		margin-top:8px;
	}
}
.charm_box{
	position:relative;
	margin-top:32px;
}
@media screen and (max-width:768px){
	.charm_box{
		margin-top:16px;
		margin-bottom:24px;
	}
}
.charm_box:first-of-type{
	margin-top:0;
}
.charm_img1{
	width:450px;
	height:300px;
	background:url('../images/charm1.jpg')no-repeat;
	background-position:center center;
	background-size:cover;
}
@media screen and (max-width:480px){
	.charm_img1{
		width:300px;
		height:200px;
		background:url('../images/charm1.jpg')no-repeat;
		background-position:center center;
		background-size:cover;
	}
}
.charm_img2{
	width:450px;
	height:300px;
	background:url('../images/charm2.jpg')no-repeat;
	background-position:center center;
	background-size:cover;
}
@media screen and (max-width:480px){
	.charm_img2{
		width:300px;
		height:200px;
		background:url('../images/charm2.jpg')no-repeat;
		background-position:center center;
		background-size:cover;
	}
}
.charm_img3{
	width:450px;
	height:300px;
	background:url('../images/charm3.jpg')no-repeat;
	background-position:center center;
	background-size:cover;
}
@media screen and (max-width:480px){
	.charm_img3{
		width:300px;
		height:200px;
		background:url('../images/charm3.jpg')no-repeat;
		background-position:center center;
		background-size:cover;
	}
}
.order-2{
	margin-left:auto;
}
@media screen and (max-width:768px){
	.order-2{
		margin-right:auto;
	}
}
.charm_body{
	position:absolute;
	top:15%;
	right:0;
	background:#FFFEF7;
	max-width:700px;
	width:100%;
	padding:24px;
	box-sizing:border-box;
	z-index:600;
}
.charm_body.order-1{
	position:absolute;
	top:15%;
	left:0;
}

@media screen and (max-width:768px){
	.charm_body,
	.charm_body.order-1{
/*
		top:60%;
		right:auto;
		left:20px;
		margin:auto;
*/
		position:relative;
		margin-top:-50px;
		margin-left:20px;
		background:#FFFEF7;
		max-width:700px;
		width:calc(100% - 20px);
		padding:16px;
		box-sizing:border-box;
	}

}

.charm_ttl{
	font-size:3rem;
	color:#846623;
	display:-webkit-flex;
	display:-moz-flex;
	display:-ms-flex;
	display:-o-flex;
	display:flex;
	-webkit-flex-wrap:wrap;
	flex-wrap:wrap;
	align-items: center;
	-webkit-align-items: center;
}
@media screen and (max-width:768px){
	.charm_ttl{
		font-size:1.8rem;
	}

}
.charm_mark{
	display:inline-block;
	width:60px;
	height:60px;
	background:#846623;
	color:#fff;
	border-radius:30px;
	font-size:2.6rem;
	line-height:1;
	text-align:center;
	margin-right:8px;
}
.charm_mark small{
	font-size:1.6rem;
	line-height:1;
}
.charm_body p{
	font-size:1.6rem;
	margin-top:8px;
}
@media screen and (max-width:768px){
	.charm_body p{
		font-size:1.4rem;
		margin-top:8px;
	}
}

/*
#################################
 
	voice
 
#################################
*/
.voice_text{
	text-align:center;
	font-size:1.8rem;
	margin-top:16px;
}

.voice_unit{
	margin-top:40px;
	display:-webkit-flex;
	display:-moz-flex;
	display:-ms-flex;
	display:-o-flex;
	display:flex;
	-webkit-flex-wrap:wrap;
	flex-wrap:wrap;
	-webkit-justify-content:space-around;
	justify-content:space-around;
}
@media screen and (max-width:768px){
	.voice_unit{
		margin-top:16px;
	}
}
.voice_list{
	margin-top:32px;
	max-width:500px;
	width:100%;
}
@media screen and (max-width:768px){
	.voice_list{
		margin-top:16px;
		width:500px;
	}

}
.voice_list dt{
	background:#846623;
	text-align:center;
	font-size:1.8rem;
	color:#fff;
	padding:8px 0;
}
@media screen and (max-width:768px){
	.voice_list dt{
		font-size:1.6rem;
		padding:8px 0;
	}
}
.voice_list dd{
	background:#ECE6C8;
	color:#333333;
	padding:16px 20px;
	box-sizing:border-box;
	font-size:1.6rem;
	min-height:280px;
}
@media screen and (max-width:768px){
	.voice_list dd{
		padding:8px 16px;
		box-sizing:border-box;
		font-size:1.4rem;
		min-height:auto;
	}

}

/*
#################################
 
	contact
 
#################################
*/
.contact_text{
	font-size:1.8rem;
	margin-top:16px;
}
@media screen and (max-width:768px){
	.contact_text{
		font-size:1.4rem;
		margin-top:8px;
	}
}
.contact_box{
	border:#333 1px solid;
	padding:40px 60px;
	box-sizing:border-box;
	margin-top:80px;
}
@media screen and (max-width:768px){
	.contact_box{
		padding:24px 24px;
		box-sizing:border-box;
		margin-top:40px;
	}

}
.contact_ttl{
	text-align:center;
	font-size:3rem;
	color:#333;
}
@media screen and (max-width:768px){
	.contact_ttl{
		font-size:1.8rem;
	}
}
.contact_data{
	padding:24px 0;
}
@media screen and (max-width:768px){
	.contact_data{
		padding:16px 0;
	}
}
.contact_data_second{
	border-top:#333 1px solid;

}
.data_ttl{
	color:#846623;
	font-size:2rem;
}
@media screen and (max-width:768px){
	.data_ttl{
		font-size:1.6rem;
	}
}
.data_main{
	font-size:5rem;
	color:#846623;
	line-height:1.3;
}
@media screen and (max-width:768px){
	.data_main{
		font-size:3rem;
	}
}
.data_main svg{
	fill:#846623;
	width:45px;
	height:auto;
}
@media screen and (max-width:768px){
	.data_main svg{
		width:30px;
		height:auto;
	}


}
.data_txt1,
.data_txt2{
	font-size:1.6rem;
}
@media screen and (max-width:768px){
	.data_txt1,
	.data_txt2{
		font-size:1.4rem;
	}
}
.data_txt2{
	margin-top:16px;
}
@media screen and (max-width:768px){
	.data_txt2{
		margin-top:8px;
	}
}


/*
#################################
 
	footer
 
#################################
*/
#footer{
	background:#997629;
	padding:60px 0 40px;
	
}
.copyright{
	text-align:center;
	background:#664E1C;
	padding:32px 0;
	line-height:1;
	font-size:1.4rem;
	color:#fff;
}
@media screen and (max-width:768px){
	.copyright{
		padding:24px 0;
		line-height:1;
		font-size:1.2rem;
	}
}
.footer_brand{
	display:block;
	width:200px;
	margin:0 auto 0;
}
.footer_menu{
	text-align:center;
	max-width:650px;
	width:100%;
	margin:40px auto 0;
}
.footer_menu li{
	display:inline-block;
	
}
.footer_menu a{
	color:#fff;
	font-size:1.4rem;
	text-decoration:none;
	padding:0 24px;
	border-right:#fff 1px solid;
}
.footer_menu a:hover{
	text-decoration:underline;

}