@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: ;}
.btn{}

.btn a{position: relative;font-size:1.8rem;background: #000000;color:#fff;display:block;text-align:center;padding: 0.5em;width: 60%;margin:1em auto;border-radius:3em;border:3px solid #fff;box-shadow:0px 0px 3px 1px #000;}
.btn a span{line-height:1;font-weight:bold;}
.btn a img{display:inline-block;width: 120px;vertical-align: middle;padding-bottom: 0.35em;}
.btn a:after{content:"";background: url(../img/ic3.png) no-repeat center center;width: 2%;height: 100%;-webkit-background-size: 100% auto;    bottom: 0;right:3%;
    margin: auto;
background-size: 100% auto;position:absolute;}
.btn a:hover{text-decoration:none;background: #411600;color:#fff;}

.amz{background: #000;display:inline-block;border-radius:3em;margin: 1em 0;position: relative;}
.amz:hover{text-decoration:none;background: #411600;color:#fff;}
.amz img{width: 120px;padding: 1em;width: 30%;text-align:center; margin: 0 auto;;}
.amz:after{content:"";background: url(../img/ic3.png) no-repeat center center;width: 3%;height: 100%;-webkit-background-size: 100% auto;    bottom: 0;right:5%;
    margin: auto;
background-size: 100% auto;position:absolute;}

span.go{display:block;position:absolute;bottom:0;right:0;background: #411600;z-index: 3;padding: 0.5em;font-weight:600;transform:skewX(-30deg);padding: 0.5em 2em 0.5em 1.5em;margin-right: -1em;}
span.go b{transform:skewX(30deg);display: inline-block;}
span.go:after{content:"▶";transform:skewX(30deg);display: inline-block;}

.mds{color:#fff;font-weight:600;font-size:3rem;color:#411600;text-align:center;padding: 4rem;}
.mds:before{display:inline-block;content:"";background: url(../img/ic1.png) no-repeat center center;width: 3rem;height:3rem;-webkit-background-size: 100% auto;margin: auto;background-size: 100% auto;}
.mds:after{display:inline-block;content:"";background: url(../img/ic2.png) no-repeat center center;width: 3rem;height:3rem;-webkit-background-size: 100% auto;margin: auto;background-size: 100% auto;}

.outer .inner{overflow:hidden;position:relative;}
.outer .inner img{max-width:100%;}

.outer .main_visual{background: url(../img/paper.jpg);padding: 4.5em 0 2em;}

section:not(.main_visual){height: 660px;}
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;}
section h2{-webkit-writing-mode: vertical-rl;-ms-writing-mode: tb-rl; writing-mode: vertical-rl;}
section h2 span{font-size:2.1rem;color:#fff;padding: 0.5em 0.25em;display: inline-block;box-shadow: 5px 5px 0 #000;position:relative;}
section h3{position:absolute;bottom: 1em;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 h4{font-size:2.1rem;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;}
.background {stroke: #fff;stroke-width: 6;stroke-linejoin: round;text-shadow: 5px 5px 0 #000;}

.area_a{background:url(../img/a_visual.png) no-repeat #000;background-position: calc(50% - 420px) -200px;background-size:1031px auto;}
.area_a section h1{color:#e8be4c;}
.area_a h1>svg { width: 100%;font-weight:900;font-size:3.4rem;color:#e8be4c;display: inline-block;height: auto;overflow: visible;}
.area_a .foreground {fill: #e8be4c;}
.area_a h1{color:#e8be4c;}
.area_a h2{display:inline-block;transform:rotate(-10deg);position:absolute;left:20px;top:140px;}
.area_a h2 span{background:#e8be4c;}
.area_a h2 i{-webkit-text-combine: horizontal;-ms-text-combine-horizontal: all;text-combine-upright: all;font-style:normal;}
.area_a h2 span:first-child{position:relative;z-index: 2}
.area_a h2 span:last-child{margin-top: 7em;}
.area_a h4 span{background: linear-gradient(transparent 60%, rgba(232,190,76,0.6) 60%); padding: 0 0.5em;line-height: 1.6;}
.area_a h4 {color:#e8be4c;text-align:right;position:absolute;right:0;bottom:125px;z-index: 2}
.area_a figure{width: 65%;position:absolute;right:0;bottom:125px;z-index: 1}
#a_icon {fill: #e8be4c;width: 1em;}
.area_a h1>span>svg{width: 1.8em;    display: inline-block;vertical-align: middle;bottom: 2px;position: relative;margin-right: 0.25em;}

.area_b{background:url(../img/b_visual.png) no-repeat #fff;background-position: calc(50% + 260px) -90px;background-size:930px auto;}
.area_b section h1{color:#9e74c5;}
.area_b h1>svg { width: 100%;font-weight:900;font-size:3.4rem;color:#9e74c5;display: inline-block;height: auto;overflow: visible;}
.area_b .foreground {fill: #9e74c5;}
.area_b h1{color:#9e74c5;}
.area_b h1 .span{fill: #9e74c5;}
.area_b h2{display:inline-block;transform:rotate(10deg);position:absolute;right:40px;top:140px;}
.area_b h2 span{background:#9e74c5;}
.area_b h2 i{-webkit-text-combine: horizontal;-ms-text-combine-horizontal: all;text-combine-upright: all;font-style:normal;}
.area_b h2 span:first-child{position:relative;z-index: 2}
.area_b h2 span:last-child{margin-top: 4em;}
.area_b h4 span{background: linear-gradient(transparent 60%, rgba(158,116,197,0.6) 60%); padding: 0 0.5em;line-height: 1.6;}
.area_b h4 {color:#9e74c5;text-align:left;position:absolute;left:0;bottom:125px;z-index: 2}
.area_b figure{width: 55.5%;position:absolute;left:0;bottom:125px;z-index: 1}
#b_icon {fill: #9e74c5;width: 1em;}
.area_b h1>span>svg{width: 1.8em;    display: inline-block;vertical-align: middle;bottom: 2px;position: relative;margin-right: 0.25em;}

.area_c{background:url(../img/c_visual.png) no-repeat #000;background-position: calc(50% - 300px) -150px;}
.area_c section h1{color:#19295e;}
.area_c h1>svg { width: 100%;font-weight:900;font-size:3.4rem;color:#19295e;display: inline-block;height: auto;overflow: visible;}
.area_c .foreground {fill: #19295e;}
.area_c h1{color:#5c6995;}
.area_c h2{display:inline-block;transform:rotate(-10deg);position:absolute;left:40px;top:120px;}
.area_c h2 span{background:#19295e;}
.area_c h2 i{-webkit-text-combine: horizontal;-ms-text-combine-horizontal: all;text-combine-upright: all;font-style:normal;}
.area_c h2 span:first-child{position:relative;z-index: 2}
.area_c h2 span:last-child{margin-top: 0;}
.area_c h4 span{background: linear-gradient(transparent 60%, rgba(25,41,91,0.6) 60%); padding: 0 0.5em;line-height: 1.6;}
.area_c h4 {color:#19295e;text-align:right;position:absolute;right:0;bottom:125px;z-index: 2}
.area_c figure{width: 52.5%;position:absolute;right:0;bottom:125px;z-index: 1}
#c_icon {fill: #5c6995;width: 1em;;}
.area_c h1>span>svg{width: 1.8em;    display: inline-block;vertical-align: middle;bottom: 2px;position: relative;margin-right: 0.25em;}

.area_d{background:url(../img/d_visual.png) no-repeat #fff;background-position: calc(50% + 300px) -150px;background-size:894px auto;}
.area_d section h1{color:#d77870;}
.area_d h1>svg { width: 100%;font-weight:900;font-size:3.4rem;color:#d77870;display: inline-block;height: auto;overflow: visible;}
.area_d .foreground {fill: #d77870;}
.area_d h1{color:#d77870;height:3em;    bottom: 1em;}
.area_d h3{bottom: 0.5em;}
.area_d h1 .span{fill: #d77870;}
.area_d h2{display:inline-block;transform:rotate(5deg);position:absolute;right:25px;top:30px;}
.area_d h2 span{background:#d77870;}
.area_d h2 i{-webkit-text-combine: horizontal;-ms-text-combine-horizontal: all;text-combine-upright: all;font-style:normal;}
.area_d h2 span:first-child{position:relative;z-index: 2}
.area_d h2 span:last-child{margin-top: 0;}
.area_d h4 span{background: linear-gradient(transparent 60%, rgba(215,120,112,0.6) 60%); padding: 0 0.5em;line-height: 1.6;}
.area_d h4 {color:#d77870;text-align:left;position:absolute;left:0;bottom:150px;z-index: 2}
.area_d figure{width: 51.5%;position:absolute;left:0;bottom:190px;z-index: 1}
#d_icon {fill: #d77870;width: 1em;}
.area_d h1>span>svg{width: 1.8em;    display: inline-block;vertical-align: middle;bottom: 2px;position: relative;margin-right: 0.25em;}

.area_e{background:url(../img/e_visual.png) no-repeat #000;background-position: calc(50% - 300px) -250px;}
.area_e section h1{color:#9ec336;}
.area_e h1>svg { width: 100%;font-weight:900;font-size:3.4rem;color:#19295e;display: inline-block;height: auto;overflow: visible;}
.area_e .foreground {fill: #9ec336;}
.area_e h1{color:#9ec336;height:2.5em;    bottom: 1em;}
.area_e h3{bottom: 0.5em;}
.area_e h2{display:inline-block;transform:rotate(-10deg);position:absolute;left:30px;top:240px;}
.area_e h2 span{background:#9ec336;}
.area_e h2 i{-webkit-text-combine: horizontal;-ms-text-combine-horizontal: all;text-combine-upright: all;font-style:normal;}
.area_e h2 span:first-child{position:relative;z-index: 2}
.area_e h2 span:last-child{margin-top: 0;}
.area_e h4 span{background: linear-gradient(transparent 60%, rgba(158,195,54,0.6) 60%); padding: 0 0.5em;line-height: 1.6;}
.area_e h4 {color:#9ec336;text-align:right;position:absolute;right:0;bottom:125px;z-index: 2}
.area_e figure{width: 52.5%;position:absolute;right:0;bottom:125px;z-index: 1}
#e_icon {fill: #9ec336;width: 1em;;}
.txt2{font-size:2.1rem;}
.area_e h1>span>svg{width: 1.8em;    display: inline-block;vertical-align: middle;bottom: 2px;position: relative;margin-right: 0.25em;}
.area_f{background: url(../img/paper.jpg);}
.area_f{height: auto!important;padding: 3em 0;}
.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{}
	section:not(.main_visual){height: 800px;;}
	section h1{bottom:auto;background: none;height:auto!important;padding: 0.5em 0;;}
	h1>svg{font-size:8rem!important;display:none!important;}
	section h1 span{display:none;font-size:2.4rem!important;white-space: normal!important;margin-right: 0;padding: 0 0.5em;}
	section h1 span:after{display:none;}
    .go{bottom:0.75em;background: #000;display:block;border:2px solid #fff;width: 95%;text-align:center;position:absolute;padding: 0.75em;font-size:2rem;left: 0;right: 0;margin: auto;    border-radius: 0.5em;}
    .go>svg{width: 2.5rem;margin-right: 0.3em;vertical-align: middle;bottom:2px;position:relative;}
    .outer .main_visual{padding: 3em 0 0 0;}
    
	.area_a{background:url(../img/a_visual.png) no-repeat #000;background-position:calc(50% - 50px) -160px;background-size:250% auto;}
	.area_a figure{width: 95%;bottom:9em;left:0;right:0;margin: auto;}
	.area_a h1{background: #000;width: 100%;;}
	.area_a h2{}
    .area_a h4{bottom:8em;text-align:left;font-size:1.6rem;left: 0;margin: auto;width: 95%; right: 0;}
    .area_a h3{bottom:7em;left: 0;margin: auto;width: 95%; right: 0;font-size:1.3rem;}
    .area_a h2{top:85px;transform:rotate(-5deg);z-index:10;}
    .area_a a{color:#e8be4c!important;font-weight:bold;}
    
    .area_b{background:url(../img/b_visual.png) no-repeat #fff;background-position:calc(50%) -50px;background-size:160% auto;}
    .area_b figure{width: 95%;bottom:9em;left:0;right:0;margin: auto;}
    .area_b h1{background: #fff;width: 100%;;}
    .area_b h1 span{background: #fff;;}
    .area_b h2{}
    .area_b h4{bottom:8em;text-align:left;font-size:1.6rem;left: 0;margin: auto;width: 95%; right: 0;}
    .area_b h3{bottom:7em;left: 0;margin: auto;width: 95%; right: 0;font-size:1.3rem;}
    .area_b h2{top:85px;transform:rotate(5deg);z-index:10;}
    .area_b a{color:#9e74c5!important;font-weight:bold;}
    
    .area_c{background:url(../img/c_visual.png) no-repeat #000;background-position:calc(50%)  -120px;background-size:130% auto;}
    .area_c figure{width: 95%;bottom:9em;left:0;right:0;margin: auto;}
    .area_c h1{background: #000;width: 100%;;}
    .area_c h1 span{background: #000;;}
    .area_c h2{}
    .area_c h4{bottom:8em;text-align:left;font-size:1.6rem;left: 0;margin: auto;width: 95%; right: 0;}
    .area_c h3{bottom:7em;left: 0;margin: auto;width: 95%; right: 0;font-size:1.3rem;}
    .area_c h2{top:85px;transform:rotate(-5deg);z-index:10;}
    .area_c a{color:#5c6995!important;font-weight:bold;}
    
     .area_d{background:url(../img/d_visual.png) no-repeat #fff;background-position:calc(50%) -100px;background-size:160% auto;}
    .area_d figure{width: 95%;bottom:9em;left:0;right:0;margin: auto;}
    .area_d h1{background: #fff;width: 100%;bottom:auto;line-height:1.3}
    .area_d h1 span{background: #fff;;}
    .area_d h2{}
    .area_d h4{bottom:8em;text-align:left;font-size:1.6rem;left: 0;margin: auto;width: 95%; right: 0;}
    .area_d h3{bottom:6.5em;left: 0;margin: auto;width: 95%; right: 0;font-size:1.3rem;}
    .area_d h2{top:85px;transform:rotate(5deg);z-index:10;}
    .area_d a{color:#d77870!important;font-weight:bold;}
    
    .area_e{background:url(../img/e_visual.png) no-repeat #000;background-position:calc(50%)  -80px;background-size:110% auto;}
    .area_e figure{width: 95%;bottom:9em;left:0;right:0;margin: auto;}
    .area_e h1{background: #000;width: 100%;bottom:auto;line-height:1.3}
    .area_e h1 span{background: #000;;}
    .area_e h2{}
    .area_e h4{bottom:8em;text-align:left;font-size:1.6rem;left: 0;margin: auto;width: 95%; right: 0;}
    .area_e h3{bottom:7em;left: 0;margin: auto;width: 95%; right: 0;font-size:1.3rem;}
    .area_e h2{top:225px;transform:rotate(-5deg);z-index:10;}
    .area_e a{color:#9ec336!important;font-weight:bold;}
    
    .area_f{background: url(../img/paper.jpg);}
    .area_f p{margin-bottom: 1em;text-align:center;font-weight:bold;font-size:2rem;    font-family: dnp-shuei-mgothic-std, sans-serif;}
    .area_f a img{width: 45%;    margin: 0 auto;}
    
    #logo{display:table-cell!important;}
    #serch_area{display:table-cell!important;}
    
}