@charset "utf-8";

/**
 *
 * global: サイト共通
 *
 */

@import url('https://fonts.googleapis.com/css?family=Lato:300');

html, body, div, span, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
abbr, address, cite, code,
del, dfn, em, img, ins, kbd, q, samp,
small, strong, sub, sup, var,
b, i,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, figcaption, figure,
footer, header, hgroup, menu, nav, section, summary,
time, mark, audio, video { margin:0; padding:0; border:0; outline:0; font-size:100%; vertical-align:baseline; background:transparent;}
body { line-height:1;}
article,aside,details,figcaption,figure,
footer,header,hgroup,menu,nav,section { display:block;}
nav ul { list-style:none;}
blockquote, q { quotes:none;}
blockquote:before, blockquote:after,
q:before, q:after { content:''; content:none;}
a { margin:0; padding:0; font-size:100%; vertical-align:baseline; background:transparent;}
/* change colours to suit your needs */
ins { background-color:#ff9; color:#000; text-decoration:none;}
/* change colours to suit your needs */
mark { background-color:#ff9; color:#000; font-style:italic; font-weight:bold;}
del { text-decoration: line-through;}
abbr[title], dfn[title] { border-bottom:1px dotted; cursor:help;}
table { border-collapse:collapse; border-spacing:0;}
ul {list-style:none; overflow: hidden;}
ol { list-style-type: none;}
img { width: 100%; max-width: 100%; height: auto; line-height: 0;}
br { line-height: inherit;}

/* change border colour to suit your needs */
hr { display:block; height:1px; border:0; border-top:1px solid #cccccc; margin:1em 0; padding:0;}
input, select { vertical-align:middle;}

::selection { color:#6A3906; background:#ceb97d; text-shadow:none; opacity:1;}
::-moz-selection { color:#6A3906; background:#ceb97d; text-shadow:none; opacity:1;}

/*--------------------------------------------------------------------------
 html
---------------------------------------------------------------------------*/
html{
 font-size: 62.5%;
 overflow-x: hidden;
}

/*--------------------------------------------------------------------------
 body
---------------------------------------------------------------------------*/
body{
 font-family: -apple-system, BlinkMacSystemFont, "Helvetica Neue", "ヒラギノ角ゴ ProN W3", Hiragino Kaku Gothic ProN, "Yu Gothic", YuGothic, Arial, "メイリオ", Meiryo, sans-serif;
 font-size:14px;
 font-size: 1.4rem;
 line-height: 1.8;
 color: #6A3906;
 -webkit-text-size-adjust:100%;
 letter-spacing: 0.075em;
}

/* @SP */
@media all and (max-width: 767px){
 body{
  min-width: 320px;
  font-size: 12px;
  font-size: 1.2rem;
 }
}

/*----------------------------------------------------------------------
 a
----------------------------------------------------------------------*/
a,a:link,a:visited,a:focus,a:active {
 outline:none;
 text-decoration: none;
}
a {
 -webkit-transition:  all 0.4s;
 -moz-transition:  all 0.4s;
 -o-transition:  all 0.4s;
 transition:  all 0.4s;
}

/*--------------------------------------------------------------------------
 clearfix
---------------------------------------------------------------------------*/
.cf:before, .cf:after { content: " "; display: table;}
.cf:after { clear: both;}
.cf { *zoom: 1;}

/*--------------------------------------------------------------------------
 width
---------------------------------------------------------------------------*/
section .inner {
 width: 90%;
 max-width: 1200px;
 margin: 0 auto;
}

/*--------------------------------------------------------------------------
 adjust
---------------------------------------------------------------------------*/
* {
box-sizing: border-box;
}

.l-flex {
display: -webkit-flex;
display: -moz-flex;
display: -ms-flex;
display: -o-flex;
display: flex;
justify-content: space-between;
-webkit-flex-wrap: wrap;
-moz-flex-wrap: wrap;
-ms-flex-wrap: wrap;
-o-flex-wrap: wrap;
flex-wrap: wrap;
}

.cont-l {
  width: 86.6666%;
  max-width: 1440px;
  margin: 0 auto;
}

.cont-m {
  width: 86.6666%;
  max-width: 1200px;
  margin: 0 auto;
}

.cont-s {
  width: 86.6666%;
  max-width: 1080px;
  margin: 0 auto;
}

.mt150 {margin-top: 150px!important;}
.mt140 {margin-top: 140px!important;}
.mt120 {margin-top: 120px!important;}
.mt100 {margin-top: 100px!important;}
.mt90 {margin-top: 90px!important;}
.mt80 {margin-top: 80px!important;}
.mt70 {margin-top: 70px!important;}
.mt60 {margin-top: 60px!important;}
.mt50 {margin-top: 50px!important;}
.mt40 {margin-top: 40px!important;}
.mt30 {margin-top: 30px!important;}
.mt20 {margin-top: 20px!important;}
.mt15 {margin-top: 15px!important;}
.mt10 {margin-top: 10px!important;}
@media screen and (max-width: 1200px) {
.mt150 {margin-top: 120px!important;}
.mt140 {margin-top: 115px!important;}
.mt120 {margin-top: 95px!important;}
.mt100 {margin-top: 80px!important;}
.mt90 {margin-top: 70px!important;}
.mt80 {margin-top: 60px!important;}
.mt70 {margin-top: 50px!important;}
.mt60 {margin-top: 45px!important;}
.mt50 {margin-top: 40px!important;}
.mt40 {margin-top: 30px!important;}
.mt30 {margin-top: 25px!important;}
.mt20 {margin-top: 16px!important;}
.mt15 {margin-top: 12px!important;}
.mt10 {margin-top: 8px!important;}
}
@media screen and (max-width: 768px) {
.mt150 {margin-top: 95px!important;}
.mt140 {margin-top: 90px!important;}
.mt120 {margin-top: 75px!important;}
.mt100 {margin-top: 60px!important;}
.mt90 {margin-top: 50px!important;}
.mt80 {margin-top: 40px!important;}
.mt70 {margin-top: 37px!important;}
.mt60 {margin-top: 35px!important;}
.mt50 {margin-top: 30px!important;}
.mt40 {margin-top: 25px!important;}
.mt30 {margin-top: 20px!important;}
.mt20 {margin-top: 14px!important;}
.mt15 {margin-top: 10px!important;}
.mt10 {margin-top: 7px!important;}
}

.pt150 {padding-top: 150px!important;}
.pt100 {padding-top: 100px!important;}
.pt90 {padding-top: 90px!important;}
.pt80 {padding-top: 80px!important;}
.pt70 {padding-top: 70px!important;}
.pt60 {padding-top: 60px!important;}
.pt50 {padding-top: 50px!important;}
.pt40 {padding-top: 40px!important;}
.pt30 {padding-top: 30px!important;}
@media screen and (max-width: 1200px) {
.pt150 {padding-top: 120px!important;}
.pt100 {padding-top: 80px!important;}
.pt90 {padding-top: 70px!important;}
.pt80 {padding-top: 65px!important;}
.pt70 {padding-top: 55px!important;}
.pt60 {padding-top: 50px!important;}
.pt50 {padding-top: 40px!important;}
.pt40 {padding-top: 30px!important;}
.pt30 {padding-top: 25px!important;}
}
@media screen and (max-width: 768px) {
.pt100 {padding-top: 60px!important;}
.pt90 {padding-top: 55px!important;}
.pt80 {padding-top: 50px!important;}
.pt70 {padding-top: 45px!important;}
.pt60 {padding-top: 35px!important;}
.pt50 {padding-top: 30px!important;}
.pt40 {padding-top: 25px!important;}
.pt30 {padding-top: 20px!important;}
}

.ptb150 { padding-top: 150px!important; padding-bottom: 150px!important;}
.ptb130 { padding-top: 120px!important; padding-bottom: 120px!important;}
.ptb120 { padding-top: 110px!important; padding-bottom: 110px!important;}
.ptb110 { padding-top: 110px!important; padding-bottom: 110px!important;}
.ptb100 { padding-top: 100px!important; padding-bottom: 100px!important;}
.ptb90 { padding-top: 90px!important; padding-bottom: 90px!important;}
.ptb80 { padding-top: 80px!important; padding-bottom: 80px!important;}
.ptb70 { padding-top: 70px!important; padding-bottom: 70px!important;}
.ptb60 { padding-top: 60px!important; padding-bottom: 60px!important;}
.ptb50 { padding-top: 50px!important; padding-bottom: 50px!important;}
.ptb40 { padding-top: 40px!important; padding-bottom: 40px!important;}
.ptb30 { padding-top: 30px!important; padding-bottom: 30px!important;}
@media screen and (max-width: 1200px) {
.ptb150 { padding-top: 120px!important; padding-bottom: 120px!important;}
.ptb130 { padding-top: 105px!important; padding-bottom: 105px!important;}
.ptb120 { padding-top: 95px!important; padding-bottom: 95px!important;}
.ptb110 { padding-top: 90px!important; padding-bottom: 90px!important;}
.ptb100 { padding-top: 80px!important; padding-bottom: 80px!important;}
.ptb90 { padding-top: 70px!important; padding-bottom: 70px!important;}
.ptb80 { padding-top: 60px!important; padding-bottom: 60px!important;}
.ptb70 { padding-top: 50px!important; padding-bottom: 50px!important;}
.ptb60 { padding-top: 45px!important; padding-bottom: 45px!important;}
.ptb50 { padding-top: 40px!important; padding-bottom: 40px!important;}
.ptb40 { padding-top: 30px!important; padding-bottom: 30px!important;}
.ptb30 { padding-top: 25px!important; padding-bottom: 25px!important;}
}
@media screen and (max-width: 768px) {
.ptb150 { padding-top: 95px!important; padding-bottom: 95px!important;}
.ptb130 { padding-top: 85px!important; padding-bottom: 85px!important;}
.ptb120 { padding-top: 75px!important; padding-bottom: 75px!important;}
.ptb110 { padding-top: 70px!important; padding-bottom: 70px!important;}
.ptb100 { padding-top: 60px!important; padding-bottom: 60px!important;}
.ptb90 { padding-top: 55px!important; padding-bottom: 55px!important;}
.ptb80 { padding-top: 50px!important; padding-bottom: 50px!important;}
.ptb70 { padding-top: 45px!important; padding-bottom: 45px!important;}
.ptb60 { padding-top: 35px!important; padding-bottom: 35px!important;}
.ptb50 { padding-top: 30px!important; padding-bottom: 30px!important;}
.ptb40 { padding-top: 25px!important; padding-bottom: 25px!important;}
.ptb30 { padding-top: 20px!important; padding-bottom: 20px!important;}
}


/*--------------------------------------------------------------------------
 Fade
---------------------------------------------------------------------------*/
.fade-in {
 transition: all 1.2s;
  -o-transition: all 1.2s; /* opera */
  -moz-transition: all 1.2s; /* firefox */
  -webkit-transition: all 1.2s; /* chrome, safari */
  -ms-transition: all 1.2s; /* ie */
 opacity: 0;
}
.in {
 opacity: 1.0;
}
.fade-up {
 transition: all 1.2s;
  -o-transition: all 1.2s; /* opera */
  -moz-transition: all 1.2s; /* firefox */
  -webkit-transition: all 1.2s; /* chrome, safari */
  -ms-transition: all 1.2s; /* ie */
 opacity: 0;
 transform: translate(0,40px);
 -webkit-transform: translate(0,40px);
}
.up {
 opacity: 1.0;
 transform: translate(0,0);
 -webkit-transform: translate(0,0);
}
.fade-left {
 transition: all 1.2s;
  -o-transition: all 1.2s; /* opera */
  -moz-transition: all 1.2s; /* firefox */
  -webkit-transition: all 1.2s; /* chrome, safari */
  -ms-transition: all 1.2s; /* ie */
 opacity: 0;
 transform: translate(-40px,0);
 -webkit-transform: translate(-40px,0);
}
.left {
 opacity: 1.0;
 transform: translate(0,0);
 -webkit-transform: translate(0,0);
}
.fade-right {
 transition: all 1.2s;
  -o-transition: all 1.2s; /* opera */
  -moz-transition: all 1.2s; /* firefox */
  -webkit-transition: all 1.2s; /* chrome, safari */
  -ms-transition: all 1.2s; /* ie */
 opacity: 0;
 transform: translate(40px,0);
 -webkit-transform: translate(40px,0);
}
.right {
 opacity: 1.0;
 transform: translate(0,0);
 -webkit-transform: translate(0,0);
}

@media screen and (max-width: 920px) {
 .fade-left,
 .fade-right {
  transition: all 1.2s;
   -o-transition: all 1.2s; /* opera */
   -moz-transition: all 1.2s; /* firefox */
   -webkit-transition: all 1.2s; /* chrome, safari */
   -ms-transition: all 1.2s; /* ie */
  opacity: 0;
  transform: translate(0,40px);
  -webkit-transform: translate(0,40px);
 }
 .left,
 .right {
  opacity: 1.0;
  transform: translate(0,0);
  -webkit-transform: translate(0,0);
 }
}