@charset "utf-8";


html     ,
body     ,
article  ,
section  ,
div      ,
h1       ,
h2       ,
h3       ,
h4       ,
h5       ,
dl       ,
dt       ,
dd       ,
ul       ,
ol       ,
li       ,
p        ,
input    ,
select   ,
textarea {
	margin: 0;
	padding:0;
	font-family:"Noto Sans JP", sans-serif "ヒラギノ角ゴ Pro W3", "メイリオ", serif;
    font-weight:normal;
	color:#40220f;
	font-size:16px;
	font-feature-settings:"palt"1;
	line-height:1.6;
	letter-spacing:0.1em;
	-webkit-text-size-adjust:100%;
	border:none;
}

html {height:100%; margin-bottom:1px; overflow-y:scroll;}
body {background:url("../img/bg.jpg"); background-size:cover;}

.en ,
footer > small {
	font-family:"Oswald", sans-serif;
	letter-spacing:0.1em;
}

img {
    max-width:100%;
	margin: 0;
	padding:0;
	vertical-align:bottom;
	line-height:0;
	border:none;
    -webkit-backface-visibility:hidden;}

ul ,
ol {list-style:none;}
li {list-style-position:outside;}

table {border-collapse:collapse;}
th , td {padding:0; text-align:left; vertical-align:top;}

a {color:#40220f; text-decoration:none; transition: .2s;}
a:hover {opacity: .6;}

p {text-align:justify; text-justify:inter-ideograph;}

* {-webkit-appearance:none;} /* iOSでinput要素にcssが効かないときの対応 */
::selection {background:#d2cdc8;}
::-moz-selection {background:#d2cdc8;} /* for Firefox */


@media only screen and (min-width:641px){

    .sp {display:none !important;}
}

@media only screen and (max-width:640px){
    
    .pc {display:none !important;}

}



/* -------------------------------------------------- */



/* header */

header {
	width:100%;
	margin:0 auto;
	display:flex; flex-flow:row wrap; justify-content:center; align-content:flex-start;
	position:relative;
}
header .logo {
	width:100%;
	position:absolute; top:0; left:0;
}
header .logo img {max-width:280px; transition: .3s;}

@media only screen and (max-width:640px){
	
	header .logo img {max-width:54%;}
}



/* main */

main {
    width:100%;
    margin:0 auto;
	padding:60px 0;
	background:url("../img/bg.png") center bottom no-repeat;
}

@media only screen and (max-width:640px){
	
	main {padding:20px 0 50px;}
}



/* article */

article {
    width:100%;
    margin:0 auto;
}

@media only screen and (max-width:640px){}



/* detail */

#detail ,
#detail h2 ,
#detail section {width:100%; display:flex; flex-flow:row wrap; justify-content:center; align-content:center; align-items:center;}

#detail a {
	width:90%;
	max-width:540px;
	margin:60px 0 80px;
	padding:20px 0;
	display:block;
	color:#fff;
	font-size:2.4rem;
	font-weight:bold;
	text-align:center;
	line-height:1.4;
	background:#c30d23;
	border:2px solid #c30d23;
	border-radius:100px;
	transition: .2s cubic-bezier(0.45, 0, 0.55, 1);
	box-shadow: 0 8px 0 #301619;
}
#detail a:hover {
	opacity:1;
	transform:translateY(8px);
	box-shadow:none;
}

@media only screen and (max-width:640px){
	
	#detail a {
		margin:30px 0 60px;
		padding:15px 0;
		font-size:1.6rem;
	}
}



/* kiyaku */

#kiyaku {
	width:90%;
	max-width:980px;
	margin:0 auto;
	padding:50px 0 0;
}
#kiyaku h3 {
	width:100%;
	margin:0 auto 20px;
	font-size:1.8rem;
	font-weight:900;
	text-align:center;
	letter-spacing:0.05em;
}
#kiyaku > div {
	height:300px;
	padding:20px;
	border-radius:10px;
	border: solid 2px #40220f;
	background:#fff;
	overflow:auto;
}
#kiyaku p ,
#kiyaku dl dt ,
#kiyaku dl dd ,
#kiyaku dl dd li {letter-spacing:0;}

#kiyaku dl dt {
	margin:30px 0 10px;
	padding:5px 15px;
	font-weight:700;
	border-radius:5px;
	background:#e6dcd0;
}
#kiyaku dl dd li {
	padding:0 0 0 20px;
	position:relative;
}
#kiyaku dl dd li::after {
	content: "";
	width: 12px;
	height:12px;
	position:absolute; top:8px; left:2px;
	border-radius:50px;
	background:#40220f;
}
#kiyaku dl dd b {
	display:block;
}
#kiyaku dl dd a {
	margin:0 0 15px;
	display:block;
}

@media only screen and (max-width:640px){
	
	#kiyaku {
		margin:30px auto 0;
		padding:0;
	}
	#kiyaku h3 {
		margin:0 auto 10px;
		font-size:1.5rem;
	}
	#kiyaku > div {padding:10px 16px;}
	
	#kiyaku dl dt {padding:5px 10px;}
	#kiyaku dl dd li {padding:0 0 0 18px;}
	#kiyaku dl dd li::after {
		width: 10px;
		height:10px;
		top:8px; left:2px;
	}
}



/* footer */

footer {
    width:100%;
    margin:0 auto;
    padding:50px 0;
	background:#3e281c;
}
footer dl dt ,
footer dl dd {
	color:#fff;
	text-align:center;
}
footer dl dt {
	margin:0 0 10px;
	font-size:1.8rem;
	font-weight:900;
}
footer dl dd a {
	width:240px;
	margin:20px auto;
	padding:5px 0;
	display:block;
	color:#3e281c;
	font-size:1.4rem;
	font-weight:700;
	text-align:center;
	letter-spacing:0 !important;
	border-radius:5px;
	background:#fff;
}

footer small {
    width:100%;
    margin:50px auto 0;
    display:block;
	color:#fff;
	font-size:1rem;
    text-align:center;
}

@media only screen and (max-width:640px){
}


