body{
    background:#EBB013;
    color:#282220;
    font-family: source-han-sans-japanese, sans-serif;
    font-weight: 300;
    font-style: normal;
    font-size: 18px;
}

.pc{display: block;}
.sp2{display: block;}
.sp{display: none;}

.inner {width: 1080px;margin: 0 auto;}

.bgO {background: #FFECDB;}
.bgW {background: #fff;}

.col1{text-align:center;}

.col2 {display: flex; align-items: center;}
.rev {flex-direction: row-reverse;}

.col2-64 .img {width: 60%;}
.col2-64 .txt {width: 40%;}


h2 {font-family: source-han-serif-japanese, serif;
    font-weight: 700;
    font-style: normal;
    font-size: 31px;}

a{transition: 0.5s;}

a:hover{opacity: 0.5;}

.fadeIn {
    opacity: 0;
    transition: 2s;
    transform: translateY(30px);
  }
  .fadeIn.is-show {
    opacity: 1;
    transform: translateY(0);
  }

/*top*/
.topView img {width: 100%;}
.topView {display: flex;align-items: center;justify-content: center; padding: 40px 60px;}

/*con1*/
.con1 h2 {margin-bottom: 30px;}
.con1 .txt{line-height:2em; font-size: 20px;}

.con1:before {content: ''; display:block; height:39px; background: #EBB013; background-image:url(../images/waveU.png);}
.con1:after {content: ''; display:block; height:39px; background: #EBB013; background-image:url(../images/waveD.png);}

.con1 .col1{margin: 30px auto;}

.sun p {position: relative;}
.pine p {position: relative;z-index: 1;}

.sun:before{content:url(../images/sun.png);position: absolute;top: 0;right: 100px;opacity: 0.5;}
.pine:after{content:url(../images/pine.png);position: absolute;bottom: 0;left: 285px;opacity: 0.5;}


.mincho{
    font-family: soDrce-han-serif-japanese, serif;
    font-weight: 400;
    font-style: normal;
}

.mincho img {vertical-align: sub;margin: 0px 6px;}

.big {font-size: 1.25em;}
.btm {display: block;margin-top: 1em;}

.con1 .rev.col2-64 {margin-top: 60px;}

/*con2*/
.con2 h2 {text-align: center;margin: 30px 0;}

.con2 .col2 {padding: 30px 0;}
.col2.col2-55 div {width: 50%;display: block;margin: 0 auto;}
.col2.col2-55 .img {text-align: center;}

.con2 h3 {font-family: source-han-serif-japanese, serif;
    font-weight: 700;
    font-style: normal;font-size: 30px;margin-bottom: 15px;}

.year{font-family: copperplate,serif; font-weight: 700; font-style: normal; color:#EBB013; font-size:28px; display: block; margin-bottom:10px;}
.yearJ {font-family: source-han-sans-japanese, sans-serif;
    font-weight: 300;
    font-style: normal;color: #282220;font-size: 15px;margin-left: 1em;}

.col2.col2-55 .txt div {width: 100%;padding: 0 20px;}
.con2 .txt p{font-size:20px;text-align: justify;line-height: 28px;}

.con2 .col1 {padding: 50px 0;}

.small {font-size: 0.8em;}

.h13{display: flex;height: 410px;align-items: center;}

.arrow:before {content: '';display: block;margin: 0 auto;width: 0;
    height: 0;
    border-style: solid;
    border-width: 30px 65px 0 65px;
    border-color: #ffecdb transparent transparent transparent;}

.logoR {position: relative;}
.col2.col2-55 .logoR {width: 443px;}
.logo20th {position: absolute;right: -30px;top: -30px;}

.con2 .col1 a {display: inline-block;text-align: center;line-height: 1.5em; border: 1px solid #282220;padding: 20px 30px;font-family: soDrce-han-serif-japanese, serif;
    font-weight: 700;
    font-style: normal;font-size: 27px;}

.con2 .col1 img {vertical-align: sub;margin: 0px 10px;}

/*con3*/
.con3 {margin: 50px 0;}

.con3 h2 {position:relative;display: inline;font-size: 39px;color: #fff;text-align: center;}
.titleCon3 {text-align: center;margin-bottom: 50px;}
.con3 h2:before {position: absolute; content: url(../images/con3L.png);display: inline-block;width: 26px;height: 38px;top: 11px;left: -35px;}
.con3 h2:after {position: absolute; content: url(../images/con3R.png);display: inline-block;width: 26px;height: 38px;top: 11px;right: -35px;}

.col3 {display: flex;justify-content: space-between; font-family: source-han-serif-japanese, serif; font-style: normal;}
.col3 div {width: 340px;text-align: center;padding: 20px 15px;}

.col3 h3{font-weight: 700; font-size: 22px; margin: 30px 0;}
.col3 img {width: 100%;}
.col3 a {margin-top: 30px;display: block;background: #FF5122;color: #fff;font-weight: 700;font-size: 22px;padding: 12px 0;}
.price {color: #ff5122;font-size: 33px;font-weight: 700;}
.price span {color: #282220;font-weight: 400;font-size: 0.65em;}

.con3 .switch {display: block;background: url(../images/wave.png);height: 78px;margin-top: 50px;}

/*con4*/
.con4 {padding-top: 60px;padding-bottom: 50px;}
.con4 .inner {display: flex;flex-direction: column;align-items: center;}

.lineG {border: 5px solid #BEB180;padding: 20px 0;}
.con4 .col2 div {width: 50%;}

.con4 .txt {text-align: justify;letter-spacing: -1.2;padding: 0px 30px;font-size: 21px;line-height: 38px;}

.con4 a {margin-top: 50px;border: 1px solid #282220;padding: 20px 30px; font-size: 27px;}

.con4 a img {width: 300px;}

/*footer*/
footer {text-align: center;padding: 50px 0;}

@media screen and (max-width: 1080px) {
.pc{display: none;}
.sp{display: block;}

h1 .sp2 {display: block;}
h1 .sp {display: none;}

.inner{width:100%; padding:0 15px;}

.col2{flex-direction: column;}
.rev{flex-direction: column;}

.txt{margin-top: 1em;}

/*con1*/
.col2-64 .img{width:100%;text-align: center;}
.col2-64 .txt{width: 100%;text-align: center;}
.sun:before{display: none;}
.pine::after{display: none;}

/*con2*/
.col2.col2-55 div{width:100%;text-align: center;}
.col2.col2-55 .txt{margin-top: 1em;}
.con2 .txt p{text-align: center;}

/*con3*/
.col3{flex-wrap: wrap;justify-content: space-around;}
.col3 div{margin: 0 10px;margin-bottom: 20px;}

/*con4*/
.con4 .col2 {flex-direction: column-reverse;}
.con4 .col2 div {width: 100%;text-align: center;}
.con4 .txt{margin:0;}
.con4 .img{margin-bottom:1em;}
}

@media screen and (max-width:770px) {
h1 .sp{display: block;}
h1 .sp2{display: none;}

/*topView*/
.topView{padding: 40px 0;}

/*con2*/
.con2 h2 img {padding: 0 15px;width: 100%;}

.con2 .col1 a{font-size: 23px;}
a img {width: 220px;padding: 0;}
.con2 .col1 img{vertical-align: baseline;}
}

@media screen and (max-width:576px) {
body{font-size: 16px;}
h2{font-size: 25px;}

/*con1*/
.con1 .txt{font-size: 18px;}

/*con2*/
.con2 h3{font-size: 28px;}
.con2 .txt p{font-size:18px;line-height:25px;}

img{width: 100%;padding:0 15px;}
p img {width: auto;padding:0;}

.col2.col2-55 .logoR{width:100%;}
img.logo20th {width: 100px;padding: 0;}
.logo20th{right:0;}

/*con3*/
.col3 div{width:100%;}

/*con4*/
.con4 .txt{padding: 0px 15px;font-size:18px;}
.con4 a{font-size:24px;text-align: center;}
}

@media screen and (max-width:370px) {
.con4 a img{width:100%;}
}