@charset "UTF-8";

/* ----------------------------------------------------------------------------------------------------
*  reset
* --------------------------------------------------------------------------------------------------*/

html,body{	height:100%;}
html{
	font-size:62.5%;
	overflow-y: scroll;
}

body, h1, h2, h3, h4, h5, h6, p, address,
ul, ol, li, dl, dt, dd,
table, th, td, img, form,figure {
	margin: 0;
	padding: 0;
	border: none;
	line-height: 100%;
	list-style-type: none;
	font-style: normal;
	font-weight: normal;
	text-align: left;
	letter-spacing: 0;
	-webkit-font-smoothing: antialiased;
}
*, *:before, *:after {
	box-sizing: border-box;
}
@media screen and (max-width: 768px) {
	.ipad body,
	.android body,
	.iphone body {
		-webkit-text-size-adjust: 100%;
	}
	.android h2,
	.android h3,
	.android ul,
	.android dl dt,
	.android dl dd,
	.android p{
		max-height: 999999px;
	}
}


/* ----------------------------------------------------------------------------------------------------
*  基本
* --------------------------------------------------------------------------------------------------*/

body{
	position: relative;
	min-width: 1000px;
	word-wrap: break-word;
	line-height: 1.5;
	color:#000;
	font-family:"Hiragino Kaku Gothic Pro","ヒラギノ角ゴ Pro W3","メイリオ",Meiryo,"ＭＳ Ｐゴシック",Arial,Verdana,sans-serif;
}	
a{
	color: #000;
	text-decoration: none;
}

img{
	vertical-align: bottom;
	max-width: 100%;
	height: auto;
}
@media screen and (max-width: 768px) {
	body{
		min-width: initial;
		min-width: auto;
	}
    img{
        max-width: initial;
        max-width: auto;
        width: 100%;
    }
}


/* ----------------------------------------------------------------------------------------------------
*  汎用
* --------------------------------------------------------------------------------------------------*/
.flex{
	display: flex;
}
.wrap{
	position: relative;
	width:750px;
	margin: 0 auto;
}
main{
	display: block;
}
@media screen and (min-width:769px) {
	.pc{
		display:block!important;
	}
	.sp{
		display:none!important;
	}
	
	a,
	a:before,
	a:after,
	input[type="submit"],
	button{
		transition: all .5s ease;
		-webkit-backface-visibility:hidden;
		backface-visibility:hidden;
		overflow:hidden
	}
	a:hover,
	input[type="submit"]:hover,
	button:hover{
		opacity: 0.7;
	}
	a,
	a * {
		outline: 1px solid transparent;
	}

	a[href^="tel:"]{
		pointer-events: none;
	}
}
@media screen and (max-width: 768px) {
	.pc{
		display:none!important;
	}
	.sp{
		display:block!important;
	}

	.wrap{
		width:100%;
	}
}

/* ------------------------------
    clearfix
------------------------------ */
.cf:after{
  content: ".";
  display: block;
  height: 0;
  font-size:0;
  clear: both;
  visibility:hidden;
}

.cf {display: inline-block;}

/* Hides from IE Mac */
* html .cf {height: 1%;}
.cf {display:block;}
/* End Hack */

/* ------------------------------
   float
------------------------------ */
.aligncenter{
    display:block;
    margin:50px auto 70px;
}
.alignright{
	float:right;
	margin: 0 0 0 1.5em;
}
.alignleft{
	float:left;
	margin: 0 1.5em 0 0;
}


/* ----------------------------------------------------------------------------------------------------
*  header
* --------------------------------------------------------------------------------------------------*/

header{
    position: relative;
	width:100%;
	height: 60px;
	background: url("../img/header_bg.png") 0 0 repeat;
}
header:after{
    content: "";
    position: absolute;
    bottom:-3px;
    left:0;
    width: 100%;
    height: 1px;
    border-bottom: 1px solid #920003;
}
header .wrap{
	height: 100%;
}
header .logo{
	position: absolute;
	top:50%;
	transform: translateY(-50%);
	left:13px;
}
header .nav_header{
	position: absolute;
	top:0;
	right:8px;
}
header .nav_header ul{
	justify-content: flex-end;
}
header .nav_header li{
	margin: 22px 0;
	height: 16px;
	line-height: 1;
}
header .nav_header li a{
	color: #fff;
	font-size: 1.6rem;
    letter-spacing: -0.01em;
}
header .nav_header li + li{
    margin-left: 18px;
}
@media screen and (max-width:768px) {
    header{
        height: 30px;
    }
    header:after{
        bottom:-2px;
    }
    header .logo{
        width: 90px;
        height: 10px;
        font-size: 0;
    }
}


/* ----------------------------------------------------------------------------------------------------
*  fv
* --------------------------------------------------------------------------------------------------*/
.fv .ttl{
    text-align: center;
}


/* ----------------------------------------------------------------------------------------------------
*  sec1
* --------------------------------------------------------------------------------------------------*/
@media screen and (min-width:769px) {
    .sec1 {
        background: url("../img/sec1_bg_pc.png") 0 0 repeat;
        padding: 25px;
    }
}


/* ----------------------------------------------------------------------------------------------------
*  sec2
* --------------------------------------------------------------------------------------------------*/
@media screen and (min-width:769px) {
    .sec2 {
        background-image:url("../img/sec2_bg2_pc.png"),url("../img/sec2_bg1_pc.png");
        background-color: #fdfcf3;
        background-position: center top,center top;
        background-repeat: no-repeat,no-repeat;
        -webkit-background-size: 600px auto,100% auto;
        background-size:600px auto,100% auto;
        padding-top: 150px;
    }
    .sec2 .wrap{
        width: 758px;
        padding-bottom: 60px;
    }
}


/* ----------------------------------------------------------------------------------------------------
*  sec3
* --------------------------------------------------------------------------------------------------*/
@media screen and (min-width:769px) {
    .sec3 {
        background: #d2e8f3;
        height: 970px;
        overflow: hidden;
    }
    .sec3 .wrap{
        overflow: visible
    }
    .sec3 img{
        position: absolute;
        top:35px;
        left:50%;
        transform: translateX(-50%);
        max-width: inherit;
        max-width: auto;
    }
}


/* ----------------------------------------------------------------------------------------------------
*  sec4
* --------------------------------------------------------------------------------------------------*/
@media screen and (min-width:769px) {
    .sec4{
        text-align: center;
    }
}


/* ----------------------------------------------------------------------------------------------------
*  sec5
* --------------------------------------------------------------------------------------------------*/
@media screen and (min-width:769px) {
    .sec5 {
        height: 1134px;
        overflow: hidden;
    }
    .sec5 .wrap{
        overflow: visible
    }
    .sec5 img{
        position: absolute;
        top:0;
        left:50%;
        transform: translateX(-50%);
        max-width: inherit;
        max-width: auto;
    }
}
@media screen and (max-width:768px) {
    .sec5 {
        margin-bottom: 5%;
    }
}


/* ----------------------------------------------------------------------------------------------------
*  sec6
* --------------------------------------------------------------------------------------------------*/
@media screen and (min-width:769px) {
    .sec6{
        background: #fcfbf0;
    }
    .sec6 .ttl_area {
        width: 100%;
        position: relative;
        background: url("../img/sec6_ttlbg_pc.png") 0 0 repeat;
    }
    .sec6 .ttl_area:after{
        content: "";
        position: absolute;
        bottom:-5px;
        left:0;
        width: 100%;
        height: 1px;
        border-bottom: 1px solid #920003;
    }
    .sec6 .ttl_area .ttl{
        text-align: center;
        padding: 15px 0;
    }
    .sec6 .wrap{
        padding: 35px 0;
    }
}
@media screen and (max-width:768px) {
    .sec6 .ttl_area {
        margin-bottom: 5%;
    }
}


/* ----------------------------------------------------------------------------------------------------
*  sec7
* --------------------------------------------------------------------------------------------------*/
@media screen and (min-width:769px) {
    .sec7 {
        width: 100%;
        background: url("../img/sec7_bg_pc.jpg") center top repeat;
    }
    .sec7 .wrap{
        text-align: center;
        padding: 10px 0 35px;
    }
    .sec7 img + img{
        margin-top: 18px;
    }
}
@media screen and (max-width:768px) {
    .sec7 {
        margin-bottom: 5%;
    }
}


/* ----------------------------------------------------------------------------------------------------
*  cta
* --------------------------------------------------------------------------------------------------*/
.cta .btn{
    position: absolute;
    bottom:133px;
    left:50%;
    transform: translateX(-50%);
    width: 718px;
}
@media screen and (min-width:769px) {
    .cta{
        overflow: hidden
    }
    .cta .wrap{
        padding: 80px 0 50px;
    }
}
@media screen and (max-width:768px) {
    .cta {
        margin-bottom: 6%;
    }
    .cta .btn{
        bottom:10.5%;
        width: 95%;
    }
}


/* ----------------------------------------------------------------------------------------------------
*  sec8
* --------------------------------------------------------------------------------------------------*/
@media screen and (min-width:769px) {
    .sec8 .ttl_area {
        width: 100%;
        background: url("../img/sec8_ttlbg_pc.png") 0 0 repeat;
    }
    .sec8 .ttl_area .ttl{
        text-align: center;
        padding: 23px 0;
    }
    .sec8 .wrap{
        padding: 20px 0 77px;
    }
    .sec8 .wrap img + img{
        margin-top: 15px;
    }
}
@media screen and (max-width:768px) {
    .sec8 .wrap img{
        margin-top: 4%;
    }
    .sec8{
        margin-bottom: 9%;
    }
}


/* ----------------------------------------------------------------------------------------------------
*  fixed_btn
* --------------------------------------------------------------------------------------------------*/
.fixed_btn{
    display: none;
    position: fixed;
    bottom: 0;
    left: 0;
    width: 100%;
    z-index: 100;
    background: #fff;
    text-align: center;
    padding: 8px 0 6px;
}
@media screen and (min-width:769px) {
    .fixed_btn a{
        display: block;
        width: 748px;
        height: 153px;
        margin: 0 auto;
    }
}
@media screen and (max-width:768px) {
    .fixed_btn{
        padding: 8px 2% 6px;
    }
}

/* ----------------------------------------------------------------------------------------------------
*  footer
* --------------------------------------------------------------------------------------------------*/
footer{
	background: #2b1a19;
    padding-bottom: 167px;
}
footer .wrap{
	padding: 25px 0;
}
footer .nav_footer{
	width:610px;
	margin: 0 auto 24px;
	flex-wrap: wrap;
    justify-content: center;
}
footer .nav_footer a{
	color: #fff;
	font-size: 2.4rem;
}
footer .nav_footer li{
    line-height: 1;
}
footer .nav_footer li:not(:last-of-type){
    line-height: 1;
    margin: 0 11px 8px 0;
}
footer .nav_footer li:not(:last-of-type):after{
    content: "|";
    display: inline-block;
    margin-left: 11px;
    color: #fff;
    font-size: 2.4rem;
}
footer .copy{
	font-size: 2.4rem;
	color: #ccc;
	text-align: center;
}
@media screen and (max-width: 768px) {
    footer{
        padding-bottom: 23%;
    }
    footer .wrap{
        width: 90vw;
        padding: 5% 0;
    }
    footer .nav_footer{
        width:100%;
        margin: 0 auto 5%;
    }
    footer .nav_footer a{
        font-size: 1.2rem;
    }
    footer .nav_footer li:not(:last-of-type){
        margin: 0 5px 2% 0;
    }
    footer .nav_footer li:not(:last-of-type):after{
        margin-left: 5px;
        font-size: 1.2rem;
    }
    footer .copy{
        font-size: 1rem;
    }
}