@charset "UTF-8";
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed,
figure, figcaption, footer, header, hgroup,
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
margin: 0;
padding: 0;
border: 0;
font-style:normal;
font-weight: normal;
font-size: 100%;
vertical-align: baseline;
}
article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section {
display: block;
}
img{
line-height: 0;
margin:0;
padding:0;
}
blockquote, q {
quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
content: '';
content: none;
}
input, textarea,{
margin: 0;
padding: 0;
}
ol, ul{
list-style:none;
}
table{
border-collapse: collapse;
border-spacing:0;
}
caption, th{
text-align: left;
}
a:focus {
outline:none;
}
.clearfix:after {
content: ".";
display: block;
clear: both;
height: 0;
visibility: hidden;
}
.clearfix {
min-height: 1px;
}
* html .clearfix {
height: 1px;
}
.both{
clear:both;
}
.inline_block {
display: inline-block;
*display: inline;
*zoom: 1;
}
*, *:before, *:after {
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
-o-box-sizing: border-box;
-ms-box-sizing: border-box;
box-sizing: border-box;
}
/* ios submit btn */
input[type="submit"] {
-webkit-appearance: none;
}
input{
-webkit-appearance: none;
}
input[type="checkbox"]{
-webkit-appearance: checkbox;
}
input[type="radio"]{
-webkit-appearance: radio;
}
button{
background-color: transparent;
border: none;
cursor: pointer;
outline: none;
padding: 0;
appearance: none;
font: initial;
}
button, input, select, textarea {
font-family : inherit;
font-size   : 100%;
}
/* ie11 */
@media all and (-ms-high-contrast: none) {
*::-ms-backdrop, main {
display : block;
}
*::-ms-backdrop, section {
display : block;
}
*::-ms-backdrop, img[src$=".svg"] {
width: 100%;
}
}
body{
color: #322116;
font-family: "Hiragino Kaku Gothic Pro", "ヒラギノ角ゴ Pro W3", "メイリオ", Meiryo, "游ゴシック体", YuGothic, "游ゴシック", "Yu Gothic", "ＭＳ Ｐゴシック", sans-serif;
font-feature-settings: 'palt';
font-size   : 1.6rem;
min-width   : 320px;
text-align  : justify;
width       : 100%;
}
@media print, screen and (min-width:768px){
a:hover,a img:hover{
opacity : 0.8;
}
}
img{
line-height : 1.0;
}
@media print, screen and (min-width:768px){
.header{
background : #fff;
width      : 100%;
}
.sp-header{
display : none;
}
.header__site-id{
align-items     : center;
display         : flex;
height          : 60px;
justify-content : space-between;
line-height: 1;
margin          : 0 auto;
max-width       : 1280px;
padding         : 0 20px;
}
}
@media screen and (max-width:767px){
.header{
display : none;
}
.sp-header{
align-items: center;
border-bottom: 1px solid #e6e6e6;
display : flex;
flex-direction: column;
height: 52px;
justify-content: center;
width: 100%;
}
.sp-header__site-id{
line-height : 0;
}
.sp-header__banking-code{
line-height : 0;
margin : 2px 0 0 0;
text-align: right;
}
}
.footer{
background : #322116;
color      : #fff;
margin     : 0 0 -25px 0;
padding    : 20px 20px;
text-align : center;
}
.footer img{
max-width: 100%;

}
.copyright{
display   : block;
font-size : 1.2rem;
font-family: "游ゴシック体", "Yu Gothic", YuGothic, "游ゴシック Medium", "Yu Gothic Medium", メイリオ, Meiryo, sans-serif;
}
@media screen and (max-width:768px){
.footer{
margin     : 0 0 -25px 0;
}
.copyright{
display   : block;
font-size : 0.8rem;
}
}
a{
color: #322116;
}
.dsp_pc{
display: inline;
}
.dsp_sp{
display: none;
}
.header{
border-bottom: solid 4px #E60000;
}
.sp-header{
border-bottom: solid 3px #E60000;
}
.nav_wrap{
background: #fff;
z-index: 1000;
}
.nav_wrap.fixed{
border-bottom: solid 1px #AD9360;
}


nav{
max-width: 1280px;
margin: 0 auto;
padding: 10px 20px;
}
nav dt,
nav dd{
display: table-cell;
}
nav dt{
width: 190px;
text-align: left;
vertical-align: middle;
padding: 0;
}
nav dt img{
vertical-align: bottom;
}
nav dd{
width: 1090px;
}
nav ul{
}
nav li{
display: table-cell;
vertical-align: middle;
font-size: 18px;
text-align: center;
position: relative;
padding: 0 1px 0 0;
}
nav li:first-child:before{
content: "";
display: block;
position: absolute;
top: 35%;
left:  0;
height: 30%;
border-left: solid 1px #AD9360;
}
nav li:after{
content: "";
display: block;
position: absolute;
top: 35%;
right:  0;
height: 30%;
border-right: solid 1px #AD9360;
}
nav li a{
display: table-cell;
padding: 10px 30px;
color: #322116;
text-decoration: none;
height: 60px;
vertical-align: middle;
}
nav li a:hover{
background: #322116;
color: #FFF;
}
nav li br{
display: none;
}
.tgl{
display: none;
}
.mv{
padding: 20px 20px;
background: #322116 url(../img/mv.jpg) no-repeat 50% 0;
position: relative;
z-index: 0;
}
@media screen and (min-width: 1440px){
.mv{
background: #322116 url(../img/mv.jpg) no-repeat 50% 0;
background-size: 100% auto;
}
}
@media screen and (max-width: 768px){
.mv{
background: #322116 url(../img/mv_sp.jpg) no-repeat 50% 0;
background-size: 100% auto;
}
}
.mv .copy{
margin: 0 auto;
max-width: 1200px;
}
.mv .copy p{
padding: 55px;
width: 388px;
font-family : 游明朝,"Yu Mincho","YuMincho",Verdana,"ヒラギノ明朝 Pro W3","HG明朝E","ＭＳ Ｐ明朝","ＭＳ 明朝",メイリオ,Meiryo,serif;
background: #AD9360;
color: #FFF;
font-size: 44px;
}
.main_ttl{
text-align: center;
color: #FFF;
padding: 85px 0 35px 0;
}
.main_ttl h1{
display: inline;
padding-bottom: 10px;
border-bottom: solid 1px #FFF;
font-size: 48px;
line-height: 2;
}
.main_ttl p{
margin-top: 30px;
padding: 0;
font-size: 31px;
line-height: 2;
}
.lead{
padding: 70px 20px;
font-size: 21px;
line-height: 2.5;
text-align: center;
background-image: url(../img/lead_bg01.png),url(../img/lead_bg02.png),url(../img/lead_bg03.png),url(../img/lead_bg04.png);
background-position: 0 0,100% 0,100% 100%,0 100%;
background-repeat: no-repeat,no-repeat,no-repeat,no-repeat;
background-size: auto auto, auto auto, auto auto, auto auto;
}
.sec01,
.sec02{
text-align: center;
}
.sec01 .inner,
.sec02 .inner,
.sec03 .inner{
padding: 100px 20px 100px 20px;
}
.sec01 h2,
.sec02 h2,
.sec03 h2{
height: 400px;
padding: 0 10px;
display: flex;
justify-content: center;
align-items: center;
background:#322116 url(../img/sec01_img01.jpg) no-repeat 50% 50%;
background-size: cover;
background-size: auto 100%;
font-size: 48px;
color: #FFF;
text-shadow: 1px 1px 5px #555;
}
.sec01 h3,
.sec02 h3{
display: inline;
padding-bottom: 10px;
font-size: 37px;
border-bottom: solid 1px #322116;
line-height: 2;
}
.sec01 .inner{
background-image: url(../img/sec01_bg01.png),url(../img/sec01_bg02.png),url(../img/sec01_bg03.png),url(../img/sec01_bg04.png);
background-position: 0 0,100% 0,100% 100%,0 100%;
background-repeat: no-repeat,no-repeat,no-repeat,no-repeat;
background-size: auto auto, auto auto, auto auto, auto auto;
}
.sec02 h2{
background:#322116 url(../img/sec02_img01.jpg) no-repeat 50% 50%;
background-size: cover;
background-size: auto 100%;
}
.sec02 .inner{
background-image: url(../img/sec02_bg01.png),url(../img/sec02_bg02.png),url(../img/sec02_bg03.png);
background-position: 0 0,100% 0, 50% 100%;
background-repeat: no-repeat,no-repeat,no-repeat,no-repeat;
background-size: auto auto, auto auto, auto auto;
padding-bottom: 145px;
}
.sec02 .inner_sub01{
background-image: url(../img/sec02_bg04.png),url(../img/sec02_bg05.png);
background-position: 50% 0, 50% 100%;
background-repeat: no-repeat, no-repeat;
background-size: auto auto, auto auto;
text-align: center;
padding: 0 20px 100px 20px;
}
.sec02 .inner_sub02{
background-image: url(../img/sec02_bg06.png), url(../img/sec02_bg07.png), url(../img/sec02_bg08.png);
background-position: 50% 0, 100% 100%, 0 100%;
background-repeat: no-repeat, no-repeat, no-repeat;
background-size: auto auto, auto auto, auto auto;
text-align: center;
padding: 0 20px 100px 20px;
}
.sec02 .inner_sub01 .img,
.sec02 .inner_sub02 .img{
padding: 0 20px 60px 20px;
}
.sec02 .inner_sub01 .img img,
.sec02 .inner_sub02 .img img{
max-width:100%;
}
.sec03{
background-image: url(../img/sec03_bg03.png);
background-position: 0 100%;
background-repeat: no-repeat;
background-size: auto auto;
text-align: center;
}
.sec03 h2{
background:#322116 url(../img/sec03_img01.jpg) no-repeat 50% 50%;
background-size: cover;
background-size: auto 100%;
}
.sec03 h3{
margin-bottom: 50px;
font-size: 37px;
}
.sec03 .inner{
background-image: url(../img/sec03_bg01.png),url(../img/sec03_bg02.png);
background-position: 0 0,100% 0;
background-repeat: no-repeat,no-repeat;
background-size: auto auto, auto auto;
}
.sec03 p{
font-size: 21px;
line-height: 2.5;
}
.sec03 .bnr{
margin-top: 100px;
text-align: center;
}
.sec03 .bnr img{
width: 100%;
max-width: 1200px;
}
.list{
margin: 0 auto;
padding: 30px 0 50px 0;
max-width: 1200px;
display: flex;
flex-wrap: wrap;
border-bottom: solid 1px #322116;
}
.list:last-child{
border: none;
}
.list .txt{
margin-top: 20px;
font-size: 28px;
text-align: left;
width: 52%;
padding-right: 30px;
}
.list ul{
display: flex;
flex-wrap: wrap;
width: 48%;
}
.list .right{
width: 48%;
}
.list .right .ttl{
text-align: left;
margin-top: 20px;
padding-left: 10px;
position: relative;
}
.list .right .ttl:before{
content:"";
display: block;
height: 64%;
border-left: solid 4px #AD9360;
position: absolute;
left: 0;
top: 18%;
}
.list .right ul{
display: flex;
flex-wrap: wrap;
width: 100%;
}
.list li{
width: 48%;
margin: 20px 0 0 4%;
}
.list li:nth-child(2n+1){
margin-left: 0;
}
.list .right li:nth-child(1),
.list .right li:nth-child(2){
margin-top: 5px;
}
.list li .color01{
width: 300px;
height: 85px;
padding: 3px;
font-size: 24px;
text-decoration: none;
vertical-align: middle;
display: table-cell;
border: solid 3px #AD9360;
border-radius: 5px;
color: #FFF;
background: #AD9360;
}
.list li .color02{
width: 300px;
height: 85px;
padding: 3px;
font-size: 24px;
text-decoration: none;
vertical-align: middle;
display: table-cell;
border: solid 3px #AD9360;
border-radius: 5px;
background: #FFF;
color: #AD9360;
}
.list li sup{
font-size: 60%;
vertical-align: super;
}
.list .note01{
margin-top: 10px;
padding-left: 1.0em;
text-align: left;
font-size: 14px;
position: relative;
line-height: 1.2;
}
.list .note02{
margin-top: 10px;
padding-left: 3.0em;
text-align: left;
font-size: 14px;
position: relative;
line-height: 1.2;
}
.list .mark01{
position: absolute;
left: 0;
top: 0;
}
.float{
position: fixed;
left: 0;
bottom: 0;
background: #d6d6d6;
color:#f00;
width: 100%;
transition: all 1s;
opacity: 0;
}
.float_inner{
padding: 20px 15px;
}
.fade{
opacity: 1;
}
.float ul{
margin: 0 auto;
display: table;
text-align: center;
}
.float li{
display: table-cell;
width: 50%;
padding: 0 15px;
}
.float li img{
width: 100%;
vertical-align: bottom;
}

@media screen and (max-width: 1280px){
nav li{
font-size: 1.4vw;
}
.list .txt{
font-size: 2.2vw;
}
.list li .color01,
.list li .color02{
font-size: 1.7vw;
}
.list li .note01,
.list li .note02{
font-size: 1.0vw;
}
}
@media screen and (max-width: 980px){
nav li{
font-size: 1.5vw;
}
nav li br{
display: block;
}
}
@media screen and (max-width: 768px){
nav{
padding: 0;
position: relative;
height: 70px;
z-index: 1;
}
nav a{
text-decoration: none;
}
nav dl{
background: #FFF;
}
nav dt{
width: auto;
position: relative;
height: 73px;
padding: 16px;
text-align: center;
display: block;
}
nav dt img{
vertical-align: inherit;
}
nav dd{
display: none;
width: auto;
}
nav ul{
border-top: solid 1px #AD9360;
}
nav li{
padding: 0;
border-bottom: solid 1px #AD9360;
text-align: left;
display: block;
}
nav li:first-child:before,
nav li:after{
display: none;
}
nav li a{
text-decoration: none;
display: block;
height: auto;
padding: 20px 10px 20px 40px;
background: url(../img/arw01.png) no-repeat 20px 50%;
background-size: 7px auto;
}
nav li br{
display: none;
}
.tgl{
position: absolute;
display: block;
width: 60px;
height: 73px;
padding-top: 40px;
top: 0;
right: 0;
font-size: 10px;
text-align: center;
background: url(../img/menu01.png) no-repeat 50% 20px;
background-size: 35px auto;
}
.tgl.open{
background: #AD9360 url(../img/menu02.png) no-repeat 50% 20px;
background-size: 12px auto;
color: #FFF;
}
nav li{
font-size: 17px;
}
.list .txt{
width: 100%;
font-size: 24px;
padding-right: 0;
}
.list .right{
width: 100%;
}
.list ul{
width: 100%;
}
.list li .color01,
.list li .color02{
width: 400px;
height: 14.0vw;
font-size: 3.2vw;
}
.list li .note01 br,
.list li .note02 br{
display: none;
}
.mv .copy p{
padding: 30px 20px;
width: 140px;
font-size: 16px;
}
.main_ttl{
padding: 15px 0 25px 0;
}
.main_ttl h1{
font-size: 28px;
}
.main_ttl p{
margin-top: 30px;
padding: 0;
font-size: 20px;
}
.lead{
padding: 50px 20px;
font-size: 15px;
}
.sec01 .inner,
.sec02 .inner,
.sec03 .inner{
padding: 50px 20px 50px 20px;
}
.sec01 h2,
.sec02 h2,
.sec03 h2{
padding: 100px 0;
font-size: 28px;
}
.sec01 h3,
.sec02 h3{
font-size: 24px;
}
.list{
display: block;
border: none;
}
.list .txt{
padding-bottom: 10px;
border-bottom: solid 1px #322116;
}
.sec03 h3{
margin-bottom: 40px;
font-size: 20px;
}
.sec03 p{
font-size: 15px;
}
.float_inner{
padding: 20px 10px;
}
.float li{
padding: 0 10px;
}
}

@media screen and (max-width: 640px){
.dsp_pc{
display: none;
}
.dsp_sp{
display: block;
}
.lead p{
text-align: left;
}
.lead{
background-image: url(../img/lead_bg01_sp.png),url(../img/lead_bg02_sp.png),url(../img/lead_bg03_sp.png),url(../img/lead_bg04_sp.png);
background-position: 0 0,100% 0,100% 100%,0 100%;
background-repeat: no-repeat,no-repeat,no-repeat,no-repeat;
background-size: 108px auto, 166px auto, 215px auto, 39px auto;
}
.sec01 .inner{
background-image: url(../img/sec01_bg01_sp.png),url(../img/sec01_bg02_sp.png),url(../img/sec01_bg03_sp.png),url(../img/sec01_bg04_sp.png);
background-position: 0 0,100% 0,100% 100%,0 100%;
background-repeat: no-repeat,no-repeat,no-repeat,no-repeat;
background-size: 202px auto, 122px auto, 274px auto, 160px auto;
}
.sec02 .inner{
background-image: url(../img/sec02_bg01_sp.png),url(../img/sec02_bg02_sp.png),url(../img/sec02_bg03_sp.png);
background-position: 0 0,100% 0, 50% 100%;
background-repeat: no-repeat,no-repeat,no-repeat,no-repeat;
background-size: 147px auto, 163px auto, 100% auto;
}
.sec02 .inner_sub01{
background-image: url(../img/sec02_bg04_sp.png),url(../img/sec02_bg05_sp.png);
background-position: 0 0, 50% 100%;
background-repeat: no-repeat, no-repeat;
background-size: 100% auto, 100% auto;
}
.sec02 .inner_sub02{
background-image: url(../img/sec02_bg06_sp.png);
background-position: 50% 100%;
background-repeat: no-repeat;
background-size: 100% auto;
}
.sec03{
background-image: url(../img/sec03_bg02_sp.png);
background-position: 0 100%;
background-repeat: no-repeat;
background-size: 518px auto;
}
.sec03 .inner{
background-image: url(../img/sec03_bg01_sp.png);
background-position: 100% 0;
background-repeat: no-repeat;
background-size: 213px auto;
}
.sec01 h2{
height: 270px;
padding: 0 10px;
display: flex;
justify-content: center;
align-items: center;
background: url(../img/sec01_img01_sp.jpg) no-repeat 50% 50%;
background-size: cover;
}
.sec02 h2{
height: 270px;
padding: 0 10px;
display: flex;
justify-content: center;
align-items: center;
background: url(../img/sec02_img01_sp.jpg) no-repeat 50% 50%;
background-size: cover;
}
.sec03 h2{
height: 270px;
padding: 0 10px;
display: flex;
justify-content: center;
align-items: center;
background: url(../img/sec03_img01_sp.jpg) no-repeat 50% 50%;
background-size: cover;
}
.sec01 h2 span,
.sec02 h2 span,
.sec03 h2 span{
margin: 0 auto;
display: inline-block;
text-align: left;
}
.sec02 .inner_sub01 .img,
.sec02 .inner_sub02 .img {
padding: 0 0 10px 0;
}
.sec02 .inner_sub01,
.sec02 .inner_sub02 {
padding: 0 20px 50px 20px;
}
.sec03 .inner {
padding: 40px 20px 30px 20px;
}
.sec03 h3 {
margin-bottom: 20px;
}
.sec03 p{
text-align: left;
}
.sec03 .bnr {
margin-top: 20px;
}
.list{
padding: 0 0 20px 0;
}
.list .txt{
font-size: 17px;
}
.list .right{
margin: 0 auto;
width: 80%;
display: block;
}
.list .note01,
.list .note02{
font-size: 10px;
}
.list ul{
margin: 0 auto;
width: 80%;
display: block;
}
.list li{
width: 100%;
margin-left: 0;
}
.list li .color01,
.list li .color02{
width: 700px;
height: 70px;
font-size: 17px;
}
.list .right .ttl{
font-size: 17px;
}
.list .right li:nth-child(2){
margin-top: 20px;
}
}

@media screen and (max-width: 360px){
.main_ttl p{
font-size: 5.5vw;
}
}

@media screen and (max-width: 320px){
.sec02 h2{
font-size: 27px;
}
}

.dsp_tab{
display: none;
}
.no_tab{
display: block;
}
@media screen and (max-width:1000px){
.dsp_tab{
display: block;
}
.no_tab{
display: none;
}
}
@media screen and (max-width:767px){
.dsp_tab{
display: none;
}
.dsp_sp.dsp_tab{
display: block;
}
.no_tab{
display: block;
}
}
@media screen and (max-width:640px){
.no_tab{
display: none;
}
.dsp_sp.no_tab{
display: block;
}
}