@import url(http://fonts.googleapis.com/earlyaccess/notosansjapanese.css);
body {
    font-family: 'Noto Sans Japanese', sans-serif;
}

/*基本設定*/
html{font-size: 62.5%;}
body,table{font-family: dnp-shuei-mgothic-std, sans-serif;font-size: 1.4rem;color:#3b3b3b;background: ;font-weight: 400;}
div{box-sizing:border-box;}
p, a{text-align:inherit}
p{word-break: normal;word-wrap: break-word;text-align:justify;}
h2{line-height:1.3em;}
ul,dl{letter-spacing: -.40em;}
li,dd,dt{letter-spacing: normal;}
img{  pointer-events: none;
  user-select: none;
  vertical-align: bottom;
  -webkit-user-select: none;
  width: auto;
  height: auto;
  -ms-interpolation-mode: bicubic;}
a img{display:block;}
a:hover img{opacity:1;}
header{display:;}
.body_in{padding: 0;}
.outer{background: url(../img/bg.jpg) no-repeat center top fixed;background-size: cover;padding-bottom: ;padding-top: 40px;}
.btn{}

.outer .inner{width: 980px;margin: 0 auto;;position:relative;}
.outer .inner img{max-width:100%;}

.outer .main_visual{padding: 3em 0;background: url(../img/paper.jpg) center top;background-size: cover;}
.outer .main_visual figure{width: 100%;margin: 0 auto;;}
.outer .main_visual figure img{width: 100%}

section:not(.main_visual){}
section .inner{position:relative;height: 100%;}
section a:hover h1{background: rgba(255,255,255,1);}
section.area_b a:hover h1,section.area_d a:hover h1{background: rgba(225,225,225,0.8);}
section h1{background: rgba(255,255,255,0.8);font-weight:900;font-size:3.4rem;position:absolute;bottom: 1.5em;width: 100%;display:flex;align-items: center;}
section h1 span{font-size:2rem;background: #000;order:1;white-space: nowrap;margin-right: 1.5em;font-family: dnp-shuei-mgothic-std, sans-serif;font-size:1.8rem;padding:0 0 0 0.5em;}
section h1 span:after{content:'';width: 1em;position:absolute;
border-top: 1.8rem solid transparent;
border-bottom: 1.8rem solid transparent;
border-left: 1.8rem solid #000;}

.areas{height: 665px;}
section.areas  h2{font-size:2.8rem;display: inline-block;position:relative;font-family: a-otf-midashi-go-mb31-pr6n, sans-serif;font-style: normal;font-weight: 600;text-shadow: white 2px 0px, white -2px 0px,white 0px -2px, white -2px 0px, white 2px 2px, white -2px 2px,  white 2px -2px, white -2px -2px, white 1px 2px, white -1px 2px,white 1px -2px, white -1px -2px, white 2px 1px, white -2px 1px,white 2px -1px, white -2px -1px;}
section.areas  h3{padding: 0.5em 0;line-height: 1.5;transform:rotate(-10deg);position:absolute;-webkit-writing-mode: vertical-rl;-ms-writing-mode: tb-rl; writing-mode: vertical-rl;font-style: normal;font-weight:600;font-size:2.8rem;text-shadow: white 2px 0px, white -2px 0px,white 0px -2px, white -2px 0px, white 2px 2px, white -2px 2px,  white 2px -2px, white -2px -2px, white 1px 2px, white -1px 2px,white 1px -2px, white -1px -2px, white 2px 1px, white -2px 1px,white 2px -1px, white -2px -1px;}
section.areas  h3 span{display:inline-block;}
section.areas  h4{transform:rotate(-3deg);font-size:3.2rem;position:absolute;font-weight:700;text-shadow: white 2px 0px, white -2px 0px,white 0px -2px, white -2px 0px, white 2px 2px, white -2px 2px,  white 2px -2px, white -2px -2px, white 1px 2px, white -1px 2px,white 1px -2px, white -1px -2px, white 2px 1px, white -2px 1px,white 2px -1px, white -2px -1px;}
section.areas  h5{font-family: initial;font-size:1.2rem;text-shadow: white 2px 0px, white -2px 0px,white 0px -2px, white -2px 0px, white 2px 2px, white -2px 2px,  white 2px -2px, white -2px -2px, white 1px 2px, white -1px 2px,white 1px -2px, white -1px -2px, white 2px 1px, white -2px 1px,white 2px -1px, white -2px -1px;}
section.areas  p{padding:1.25em 1em 0.5em 1em;line-height:1.4;position:relative;margin: 1.5em 0 0 0;}
section.areas  p i{display:inline-block;color:#fff;position:absolute;top:-1em;padding: 0.25em 1em;font-style:normal;font-size:1.1rem;}
section.areas  figure{position:absolute;right:0;top:40px;}
section.areas a{position:absolute;right:0;bottom:6px;}
section.areas a span{    display: flex;align-items:center;height: 36px;font-size:2rem;background: #000;order:1;white-space: nowrap;margin-right: 1.5em;font-family: dnp-shuei-mgothic-std, sans-serif;font-size:1.8rem;padding:0 0 0 0.5em;}
section.areas a span:after{right: -9px;content:'';width: 1em;position:absolute;border-top: 1.8rem solid transparent;border-bottom: 1.8rem solid transparent;border-left: 1.8rem solid #000;}
section.areas a span svg { width: 25px;font-weight:900;font-size:3.4rem;color:#ffb1bf;display: inline-block;height: auto;overflow: visible;margin-right: 0.25em;}
.a_icon{fill:#ffb1bf;}
a:hover .a_icon{fill:#ff3357;}
.b_icon{fill:#a7e2cc;}
a:hover .b_icon{fill:#02ac6c;}
a:hover {text-decoration:none;}

.areas .ttl{background:rgba(255,255,255,0.8);position:absolute;bottom:3.5em;padding: 1em;display:flex;align-items:center;}
.areas .ttl .sale{padding: 1em;width: ;}
.areas .ttl .sale div{font-weight:bold;background: #000;color:yellow;border-radius:100%;width: 85px;height: 85px;justify-content:center;display:flex;align-items:center;    text-align: center;line-height:1.2;}

.area_a{background:url(../img/visual01.png) no-repeat calc(50% - 220px) -200px #ffccd5;}
.area_a  h2 {color:#ff3357;}
.area_a  h3 {left:0;top: 2em;}
.area_a  h3 span{background: rgba(255,126,149,0.8);color:#ff3357;padding:0.5em 0.15em;}
.area_a  h3 span:last-child{margin-top: 2em;}
.area_a  h4 {right:0;top:365px;z-index: 1;color:#ff3357}
.area_a  h4 span{background: rgba(255,126,149,0.8);color:#ff3357;padding:0.1em 0.1em;}
.area_a p{border:1px solid #ff3357;}
.area_a p i{background: #ff3357;}
.area_a a{color:#ffb1bf;}
.area_a a:hover{color:#ff3357;}
section.area_a  figure{top: 20px;}

.area_b{background:url(../img/visual02.png) no-repeat calc(50% - 220px) -200px #bce9d8;}
.area_b  h2 {color:#02ac6c;}
.area_b  h3 {left:0;top: 2em;}
.area_b  h3 span{background: rgba(123,212,179,0.8);color:#02ac6c;padding:0.5em 0.15em;}
.area_b  h3 span:last-child{margin-top: 2em;}
.area_b  h4 {right:0;top:345px;z-index: 1;color:#02ac6c}
.area_b  h4 span{background: rgba(123,212,179,0.8);color:#02ac6c;padding:0.1em 0.1em;line-height:1.4;}
.area_b p{border:1px solid #02ac6c;}
.area_b p i{background: #02ac6c;}
.area_b a{color:#a7e2cc;}
.area_b a:hover{color:#02ac6c;}

.area_c{background:url(../img/visual03.png) no-repeat calc(50% - 220px) -110px #ffccd5;}
.area_c  h2 {color:#ff3357;}
.area_c  h3 {left:0;top: 2em;}
.area_c  h3 span{background: rgba(255,126,149,0.8);color:#ff3357;padding:0.5em 0.15em;}
.area_c  h3 span:last-child{margin-top: 2em;}
.area_c  h4 {right:0;top:335px;z-index: 1;color:#ff3357}
.area_c  h4 span{background: rgba(255,126,149,0.8);color:#ff3357;padding:0.1em 0.1em;line-height:1.4;}
.area_c p{border:1px solid #ff3357;}
.area_c p i{background: #ff3357;}
.area_c a{color:#ffb1bf;}
.area_c a:hover{color:#ff3357;}

.area_d{background:url(../img/visual04.png) no-repeat calc(50% - 220px) -170px #bce9d8;}
.area_d  h2 {color:#02ac6c;}
.area_d  h3 {left:0;top: 0;}
.area_d  h3 span{background: rgba(123,212,179,0.8);color:#02ac6c;padding:0.5em 0.15em;}
.area_d  h3 span:last-child{}
.area_d  h4 {right:0;top:365px;z-index: 1;color:#02ac6c}
.area_d  h4 span{background: rgba(123,212,179,0.8);color:#02ac6c;padding:0.1em 0.1em;}
.area_d p{border:1px solid #02ac6c;}
.area_d p i{background: #02ac6c;}
.area_d a{color:#a7e2cc;}
.area_d a:hover{color:#02ac6c;}

.area_e{background:url(../img/visual05.png) no-repeat calc(50% - 220px) -200px #ffccd5;}
.area_e  h2 {color:#ff3357;}
.area_e  h3 {left:0;top: 2em;}
.area_e  h3 span{background: rgba(255,126,149,0.8);color:#ff3357;padding:0.5em 0.15em;}
.area_e  h3 span:last-child{margin-top: 2em;}
.area_e  h4 {right:0;top:335px;z-index: 1;color:#ff3357}
.area_e  h4 span{background: rgba(255,126,149,0.8);color:#ff3357;padding:0.1em 0.1em;line-height:1.4;}
.area_e p{border:1px solid #ff3357;}
.area_e p i{background: #ff3357;}
.area_e a{color:#ffb1bf;}
.area_e a:hover{color:#ff3357;}


.area_g{padding: 2em 0 5em;text-align:center;}
.area_g h2{font-size:2.9rem;text-align:center;margin-bottom: 1em;}
.area_g h2 span{background: linear-gradient(transparent 60%, #ffff00 60%);position:relative;}
.area_g h2 span:before{position:absolute;left: -1em;content:url(../img/dasg1.png);}
.area_g h2 span:after{position:absolute;right: -1em;content:url(../img/dasg2.png);}
.area_g p{font-size:2.2rem;text-align:center;margin-bottom: 1em;}
.area_g h4{font-size:1.6rem;text-align:center;background:#bce9d8;display:inline-block;position:relative;height: 50px;line-height: 50px;padding:0 2em;margin-bottom: 2em;}
.area_g h4:before, .area_g h4:after {position: absolute;content: ''; width: 0px;height: 0px;z-index: 1;}
.area_g h4:before {top: 0;left: 0;border-width: 25px 0px 25px 15px;border-color: transparent transparent transparent #fff;border-style: solid;}
.area_g h4:after {top: 0;right: 0;border-width: 25px 15px 25px 0px;border-color: transparent #fff transparent transparent;border-style: solid;}
.area_g h4 span{color:#ff3357;}
.area_g h3 {position: relative;background: #e5e5e5;font-size:1.8rem;text-align:center;padding: 0.5em 0;margin-bottom: 2em;}
.area_g h3:before{content: "";position: absolute;top: 100%;left: 50%; margin-left: -15px; border: 15px solid transparent; border-top: 15px solid #e5e5e5;}

.area_g dl.g1{display:flex;width: 85%;margin: 0 auto 2em;flex-wrap:wrap;background: #ffded5;justify-content: center;padding: 0 2em;}
.area_g dl.g1 dd{width: 30%;margin:1em 1.5%;}
.area_g dl.g1 dt{width: 100%;margin:2em 1.5% 1em;text-align:center;;}
.area_g dl.g1 dt span{font-size:2rem;font-weight:600;background: #ffb4a0;color:#fff;font-family: initial;padding: 0.5em 1em;width: 35%;    display: inline-block;}
.area_g ul.g2{column-count:3;width: 85%;margin: 0 auto 2em;}
.area_g ul.g2 li{font-size:2rem;}
.area_g ul.g2 li a:hover{text-decoration:underline;}

.area_f{}
.area_f{background: url(../img/paper.jpg);padding: 4.5em 0 2em;background-size: cover;}
.area_f{height: auto!important;padding: 3em 0;}
.area_f>div>div{padding: 2em 0 5em;}
.area_f p{margin-bottom: 1em;text-align:center;font-weight:bold;font-size:2.3rem;    font-family: dnp-shuei-mgothic-std, sans-serif;}
.area_f a{background: #000;display:block;width: 75%;margin: 0 auto;border-radius:10px;text-align:center;padding: 1em;}
.area_f a img{width: 30%;    margin: 0 auto;}
.area_f a:hover{background: #222;}


/*smartphone*****************************************************************************************************************************************************************************************/
@media screen and (max-width: 768px) {
	html{font-size: 50%;}
	.inner{width: 100%;}
	.outer {padding-top: 34px;overflow: hidden;}
    .outer .inner{width: 100%;}
    .outer .main_visual{padding: 0;}
    .areas{height: auto;height: 1100px;}
    .areas .ttl{width: 95%;    right: 0;left: 0; margin: auto;bottom: 6em;}
    section.areas a{width: 80%;right:0;margin:auto;left:0;bottom:15px;}
    section.areas a span {justify-content:center;}
    .sale{display:none;}
    section.areas figure{width: 95%;position:absolute;left: 0;right:0;margin: auto;bottom:10px;top:auto;}
    section.areas a{display:none;}
    section.areas h4{font-size:2.5rem;}
    section.areas h3{left:5px}
    
    .sp_ttl{position:relative;width: 100%;background: none!important;height: auto!important;}
    .sp_ttl .ttl{position:relative;bottom:auto;margin: 0 auto 5em;}
    .sp_ttl a{display:block!important;}
    
    .area_a {background: url(../img/visual01.png) no-repeat -50px -100px #ffccd5;height:800px;}
    section.area_a figure{width: 95%;position:absolute;left: 0;right:0;margin: auto;bottom:10px;top:auto;}
    section.area_a h4{bottom:10px;top:auto;}
    section.area_a h3{top:156px;}
    
    .area_b {background: url(../img/visual02.png) no-repeat center -100px #bce9d8;height: 800px;}
    section.area_b figure{width: 95%;position:absolute;left: 0;right:0;margin: auto;bottom:10px;top:auto;}
    section.area_b h4{bottom:10px;top:auto;}
    section.area_b h3{top:156px;}
    
    .area_c {background: url(../img/visual03.png) no-repeat center -100px #bce9d8;height: 800px;}
    section.area_c figure{width: 95%;position:absolute;left: 0;right:0;margin: auto;bottom:10px;top:auto;}
    section.area_c h4{bottom:10px;top:auto;}
    section.area_c h3{top:256px;right:30px;left:auto;transform: rotate(10deg);}
    
    .area_d {background: url(../img/visual04.png) no-repeat center -100px #bce9d8;height: 800px;}
    section.area_d figure{width: 95%;position:absolute;left: 0;right:0;margin: auto;bottom:10px;top:auto;}
    section.area_d h4{bottom:10px;top:auto;}
    section.area_d h3{top:226px;left:30px;}
    
    .area_e {background: url(../img/visual05.png) no-repeat center -100px #bce9d8;height: 800px;}
    section.area_e figure{width: 95%;position:absolute;left: 0;right:0;margin: auto;bottom:10px;top:auto;}
    section.area_e h4{bottom:10px;top:auto;}
    section.area_e h3{top:256px;right:30px;left:auto;transform: rotate(10deg);}
    
    .area_g{    border-top: 1px solid #ccc;width: 95%;margin: 0 auto}
    .area_g h4{    padding: 0 1em;}
    .area_g dl.g1{width: 100%;box-sizing: border-box;padding: 0.5em;}
.area_g ul.g2{width: 100%;column-count: 1}
.area_g ul.g2 li{width: 100%;}

    #logo{display:table-cell!important;}
    #serch_area{display:table-cell!important;}
    
}