@charset "utf-8";

@import url('https://fonts.googleapis.com/css?family=Oswald');
@import url('https://fonts.googleapis.com/css?family=Fjalla+One');
@import url('https://fonts.googleapis.com/css?family=Roboto');
@font-face {
   font-family: 'Noto Sans Japanese';
   font-style: normal;
   font-weight: 900;
   src: url(http://fonts.gstatic.com/ea/notosansjapanese/v6/NotoSansJP-Black.woff2) format('woff2'),
        url(http://fonts.gstatic.com/ea/notosansjapanese/v6/NotoSansJP-Black.woff) format('woff'),
        url(http://fonts.gstatic.com/ea/notosansjapanese/v6/NotoSansJP-Black.otf) format('opentype');
 }

/*
Author: Spreaf
Author URI: spreaf.com
*/

/* Gメニュー:Oswald Regular {font-family: 'Oswald', sans-serif;} */
/* 見出し:Fjalla One {font-family: 'Fjalla One', sans-serif;} */
/* 本文フォント:Roboto　Regular {font-family: 'Roboto', sans-serif;} */

body {
    font-family: 'Roboto', sans-serif;
    color: #000;
    letter-spacing: .1em;
    background-color: #fff;
}
a, a img {
    transition: .2s;
}
a:hover, a:hover img {
    text-decoration: none;
}
img {
    vertical-align: bottom;
    max-width: 100%;
    height: auto;
}
section {
	clear:both;
    position:relative;
}
#wrapper {overflow:hidden}
.wrapper {
    clear:both;
    position:relative;
    margin-left:auto;
    margin-right:auto;
}

@media screen and (max-width: 767px) {/*sp*/
    .sp{display:block;}
    .pc{display:none;}
    body {
        font-size: 1.2rem;
        line-height: 1.5;
    }
    .wrapper {
        padding-left: 15px;
        padding-right: 15px;
    }
}
@media screen and (min-width: 768px) {/*pc*/
    .sp{display:none;}
    .pc{display:block;}
    html,body{min-width:1070px;}
    body {
        font-size: 1.4rem;
        line-height: 1.71;
    }
    a:hover, a:hover img {
        text-decoration: none;
        opacity: 0.7;
        filter: alpha(opacity=70);
        -ms-filter: "alpha(opacity=70)";
    }
    a[href^="tel:"] {pointer-events: none;}
    .wrapper {width:1030px;}
}


/* ================================================
baseLayout
================================================ */
/* header
================================================ */
header {
    background: #fff;
    width: 100%;
}
header .logo a,
header .btn_contact a {display:block}
header ul {
    font-family: 'Oswald', sans-serif;
    font-weight: 400;
}
button {
    background: none;
    border:none;
}
@media screen and (max-width: 767px) {/*sp*/
    header {height:67px; position:fixed; z-index:200;}
    header .wrapper {padding:0}
    header .logo {
        width: 150px;
        position: absolute;
        top: 10px;
        left: 14px;
    }
    header .btn_contact {
        width: 90px;
        position: absolute;
        top:13.5px;
        right:70px;
    }    
    header .btn_menu {
        display: flex;
        align-items: center;
        justify-content: center;
        width: 60px;
        height: 65px;
        position: absolute;
        top: 0;
        right: 0;
        z-index: 100
    }
    header .btn_menu img {width: 22px;}
    header nav {
        display: none;
        position: relative;
        z-index: 1000;
    }
    header .drawer_nav_wrapper {
        padding: 65px 0 0;
        position: relative;
        z-index: 1000;
    }
    header nav .btn_close {
        display: flex;
        align-items: center;
        justify-content: center;
        background-color: #e60012;
        width: 60px;
        height: 65px;
        position: absolute;
        top: 0;
        right: 0;
    }
    header nav .btn_close img {width: 24px;}
    header nav ul {
        background: #fff;
        border-top: solid 1.5px #fff;
    }
    header nav li {
        font-size:12px;
        border-bottom:solid 1.5px #fff;
    }
    header nav li a {
        display:flex;
        align-items:center;
        justify-content:center;
        color:#fff;
        background-color:#e60012;
        height:55px;
    }
	
}
@media screen and (min-width: 768px) {/*pc*/
    header .wrapper {
        height:132px;
    }
    header .logo {
        width: 202px;
        position: absolute;
        top: 18px;
        left: 6px;
        z-index: 100;
    }    
    header nav {
        position: absolute;
		z-index: 1000;
        background-color: #fff;
	    color:#000;
        top:82px;
        right:0;
    }
	.is-animation nav {
		position: fixed;
        background-color: #000;
        width: 100%;
        top: 0;
    }
    header .fixed_order{
        display: none;
    }
	.is-animation .fixed_order {
		display: block;
    }
    header ul {
        display: -webkit-flex;display: flex;
    }
	.is-animation ul {
		width:1100px;
		margin: 0 auto;
    }
    header li {
        font-size: 14px;
        margin-left: 50px;
    }
	.is-animation li {
		margin: 0 auto;
    }
	header li:last-child {
	margin-left: 0;
    }
    header li a {
        display: block;
        color: #393939;
        padding: 10px 3px;
        border-bottom: solid 7px transparent;
    }
	.is-animation li a {
		color: #fff;
    }
    header li a:hover {
        border-bottom: solid 7px #e60012;
        opacity: 1;
        filter: alpha(opacity=100);
        -ms-filter: "alpha(opacity=100)";
    }
    header .btn_contact {
        width: 139px;
        height: 63px;
        position: absolute;
        top:18px;
        right:0;
    }
}


/* #main 
================================================ */
main {}


/* footer
================================================ */
footer {
	clear: both;
    color: #fff;
    background: #202020;
}
footer .copy {
    font-family: 'Roboto', sans-serif;
    font-weight: 400;
    font-size: 16px;
    font-style: normal;
    text-align: center;
}
@media screen and (max-width: 767px) {/*sp*/
    footer {
        padding-top: 10px;
        padding-bottom: 18px;
    }
    footer .copy {font-size: 12px;}
}
@media screen and (min-width: 768px) {/*pc*/
    footer {
        padding-top: 45px;
        padding-bottom: 68px;
    }
}



/* ================================================
common
================================================ */
/* テキスト・レイアウト */
.bold{font-weight:bold}
.center{text-align:center}
.ta_right{text-align:right}
.ta_left{text-align:left}
.clear{clear:both}
.f_right{float:right;}
.f_left{float:left;}

/*見出し*/
.head {/*h2*/
    font-family: 'Fjalla One', sans-serif;
    font-size: 2.6rem;
    line-height: 1.15;
    position: relative;
    z-index: 30
}
.ttl {/*h3*/
    font-family: 'Fjalla One', sans-serif;
    font-size: 1.5rem;
    line-height: 1.6;
}
@media screen and (max-width: 767px) {/*sp*/}
@media screen and (min-width: 768px) {/*pc*/
    .head {
        font-size: 5.2rem;
    }
    .ttl {
        font-size: 2rem;
        line-height: 1.5;
    }
}

/* sedtion head_icon */
.head_icon {
    position: relative;
}
.head_icon::before {
    content:"";
    background-repeat: no-repeat;
    background-position: center top;
    /*background: url(../images/home/sec2_bg.jpg) no-repeat center -58px;*/
    margin: auto;
    position: absolute;
    left: 0;
    right: 0;
    z-index: 10;
    top: -32px;
    width: 64px;
    height: 64px;
    border-radius: 50%;
}
.head_icon::after {
    content:"";
    /*background-image: url(../images/home/sec2_head_icon.png);*/
    background-repeat: no-repeat;
    background-position: center top;
    background-size: contain;
    margin: auto;
    position: absolute;
    left: 0;
    right: 0;
    z-index: 10;
    top: -64px;
    width: 128px;
    height: 128px;
}
@media screen and (max-width: 767px) {/*sp*/
    .head_icon::before,.head_icon::after{
        width:64px;
        height:64px;
        top:-32px;
    }
    .sec2 .head_icon::before{background: url(../images/home/sec2_bg.jpg)center 2px/375px auto;}
    .sec2 .head_icon::after {background-image: url(../images/home/sec2_head_icon.png);}
    .sec3 .head_icon::before{background: url(../images/home/sec3_bg.jpg)center 2px/375px auto;}
    .sec3 .head_icon::after {background-image: url(../images/home/sec3_head_icon.png);}
    .sec4 .head_icon::before{background:#fff;}
    .sec4 .head_icon::after {background-image: url(../images/home/sec4_head_icon.png);}
    .sec5 .head_icon::before{background: url(../images/home/sec5_bg.jpg)center 2px/375px auto;}
    .sec5 .head_icon::after {background-image: url(../images/home/sec5_head_icon.png);}
    .sec7 .head_icon::before{background: url(../images/home/sec5_bg.jpg)center 2px/375px auto;}
    .sec7 .head_icon::after {background-image: url(../images/home/sec7_head_icon.png);}
    .sec8 .head_icon::before{background:#fff;}
    .sec8 .head_icon::after {background-image: url(../images/home/sec8_head_icon.png);}
}
@media screen and (min-width: 768px) {/*pc*/
    .head_icon::before,.head_icon::after{
        width: 128px;
        height: 128px;
        top: -64px;
    }
    .sec2 .head_icon::before{background: url(../images/home/sec2_bg.jpg)center -58px;}
    .sec2 .head_icon::after {background-image: url(../images/home/sec2_head_icon.png);}
    .sec3 .head_icon::before{background: url(../images/home/sec3_bg.jpg)center -46px;}
    .sec3 .head_icon::after {background-image: url(../images/home/sec3_head_icon.png);}
    .sec4 .head_icon::before{background:#fff;}
    .sec4 .head_icon::after {background-image: url(../images/home/sec4_head_icon.png);}
    .sec5 .head_icon::before{background: url(../images/home/sec5_bg.jpg)center -46px;}
    .sec5 .head_icon::after {background-image: url(../images/home/sec5_head_icon.png);}
    .sec7 .head_icon::before{background: url(../images/home/sec5_bg.jpg)center -46px;}
    .sec7 .head_icon::after {background-image: url(../images/home/sec7_head_icon.png);}
    .sec8 .head_icon::before{background:#fff;}
    .sec8 .head_icon::after {background-image: url(../images/home/sec8_head_icon.png);}
}


/* ================================================
home
================================================ */
.first_view {}
@media screen and (max-width: 767px) {/*sp*/
    .first_view .wrapper {padding:0; margin-top:60px;}
}
@media screen and (min-width: 768px) {/*pc*/
    .first_view {width:100%;}
	.first_view .wrapper {width:100%;text-align:center;}
}

.sec1 {}
@media screen and (max-width: 767px) {/*sp*/
    .sec1 {
        padding-bottom: 80px;
    }
    .sec1 .head {
        text-align: center;
        padding-top: 40px;
        margin-bottom: 35px;
    }
	.sec1 .william {
		display: block;
		margin-top: 30px;
    }
	.sec1 .left {
		width: 100%;
		padding-right: 0;
		margin-bottom: 20px;
    }
	.sec1 .right {
        width: 100%;
    }
	.sec1 .name {
        font-weight: bold;
        font-size:14px;
		margin-bottom: 10px;
    }
}
@media screen and (min-width: 768px) {/*pc*/
    .sec1 {
        padding-bottom: 175px;
    }
    .sec1 .head {
        text-align: center;
        padding-top: 42px;
        margin-bottom: 32px;
    }
	.sec1 .william {
		display: flex;
		margin-top: 30px;
    }
	.sec1 .left {
		width: 50%;
		padding-right: 20px;
    }
	.sec1 .right {
        width: 50%;
    }
	.sec1 .name {
        font-weight: bold;
        font-size:16px;
		margin-bottom: 10px;
    }
}

/* .sec2 */
.sec2 {background:url(../images/home/sec2_bg.jpg)center top;color:#fff;overflow: visible}
.sec2 .wrapper::before,
.sec2 .wrapper::after,
.sec5 .wrapper::before,
.sec7 .wrapper::before{
    content:"";
    position: absolute;
    z-index: 10
}
@media screen and (max-width: 767px) {/*sp*/
    .sec2 {
        background-size:100% auto;
        padding-bottom: 30px;
    }
	.sec2 .wrapper::before {
        background: url(../images/home/cloud3_sp.png);
        background-size: cover;
        width: 125px;
        height: 124px;
        top: -61px;
        left:0;
    }
    .sec2 .wrapper::after {
        background: url(../images/home/cloud2_sp.png);
        background-size: cover;
        width:135px;
        height:128px;
        bottom:-125px;
        right:0;
    }
    .sec2 .head {
        padding-top: 80px;
        text-align: center;
        margin-bottom: 40px;
		text-align: center;
    }
    .sec2 .box {
        margin-bottom: 30px
    }
    .sec2 .box .img {
        width: 81px;
        margin: 0 auto 25px
    }
    .sec2 .box .ttl {
        margin-bottom: 20px;
    }
    .sec2 .box:nth-child(1) .ttl {text-align:center}
    .sec2 .box:nth-child(2) .ttl {text-align:center}
    .sec2 .box:nth-child(3) .ttl {text-align:center}
}
@media screen and (min-width: 768px) {/*pc*/
    .sec2 .wrapper {
        padding-bottom: 172px;
    }
    .sec2 .wrapper::before {
        content:"";
        background: url(../images/home/cloud1.png);
        width: 491px;
        height: 349px;
        position: absolute;
        top: -138px;
        left:-256px;
    }
    .sec2 .wrapper::after {
        content:"";
        background: url(../images/home/cloud2.png);
        width:512px;
        height:247px;
        position: absolute;
        bottom: -166px;
        right:-254px;
    }
    .sec2 .head {
        padding-top: 92px;
        text-align: center;
        margin-bottom: 58px;
    }
    .sec2 .box_wrap {
        display: flex;
        -webkit-justify-content: space-between;
        justify-content: space-between;
    }
    .sec2 .box {
        max-width: 30%;
    }
    .sec2 .box .img {
        display: flex;
        align-items: center;
        justify-content: center;
        width: 162px;
        max-width:100%;
        height: 89px;
        margin: 0 auto 44px
    }
    .sec2 .box .img img {
        width: 100%;
    }
    .sec2 .box .ttl {
        text-align: center;
        height: 138px;
    }
}

@media screen and (max-width: 767px) {/*sp*/

    .sec3 {
        background-size:100% auto;
        padding-bottom:90px;
    }
    .sec3 .head {
        text-align: center;
        padding-top: 90px;
        margin-bottom: 20px;
    }
    .sec3 .block1 .box_img {
        width:59px;
        margin:0 auto 32px
    }
    .sec3 .block1 .box_txt {margin-bottom:40px}
    .sec3 .img2 {
        width:194px;
        margin: 0 auto 20px;
    }
    .sec3 .block2 {
        position: relative}
    .sec3 .block2 .box1 {}
    .sec3 .block2 .box1 .ttl {
        font-size: 18px;
        line-height: 24px;
        margin-bottom: 13px;
		text-align: center;
    }
    .sec3 .block2 .box1 .img {
        width:231.5px;
        margin: 30px auto 20px;
    }
    .sec3 .block2 .box2 {}
    .sec3 .block2 .box2 .ttl {
        font-size: 24px;
        line-height: 45px;
        margin-bottom: 13px;
		text-align:center;
    }
    .sec3 .block2 .box3 {
        color: #de3e3e;
        font-size: 15px;
        line-height: 24px;
    }
    .sec3 .block2 .box3 .img {
        width:291px;
        margin:38px auto 34px;
    }
}
@media screen and (min-width: 768px) {/*pc*/
    .sec3 {}
    .sec3 .head {
        text-align: center;
        padding-top: 92px;
        margin-bottom: 60px;
    }
    .sec3 .block1 {
        display: flex;
        flex-wrap: wrap;
        justify-content: space-between;
        margin-bottom: 58px;
    }
    .sec3 .block1 .box_img {width: 140px}
    .sec3 .block1 .box_img img {width: 117.5px}
    .sec3 .block1 .box_txt {width: 890px;padding-top: 12px;}
    .sec3 .block2 {
        position: relative;
        height: 1120px;
    }
    .sec3 .block2 .img2 {
        width:492px;
        margin: 0 auto 20px;
    }
    .sec3 .block2 .box1 {
        width: 430px;
        height: 270px;
        position: absolute;
        left: 0;
        top: 270px;
    }
    .sec3 .block2 .box1 .ttl {
        margin-bottom: 20px;
    }
    .sec3 .block2 .box1 .img {
        width:281px;
        margin-top: 48px;
    }
    .sec3 .block2 .box2 {
        width: 350px;
        height: 270px;
        position: absolute;
        right: 0;
        top: 260px;
    }
    .sec3 .block2 .box2 .ttl {
        font-size: 30px;
        margin-bottom: 5px;
    }
    .sec3 .block2 .box3 {
        color: #de3e3e;
        font-size: 18px;
        line-height: 30px;
        width: 370px;
        height: 400px;
        position: absolute;
        left: 200px;
        top: 608px;
    }
    .sec3 .block2 .box3 .img {
        width:436px;
        position: absolute;
        left: 400px;
        top: -124px;
    }
}

/* button[ORDER FORM] */
.btn_order a {
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: #084074;
    margin: auto;
    width: 326px;
    max-width: 100%;
    height: 63px;
    border-radius: 32px;
}
@media screen and (max-width: 767px) {/*sp*/
    .btn_order img {width:175px}
}
@media screen and (min-width: 768px) {/*pc*/
    .btn_order img {width:210px}
}
/* .sec4 */
.sec4 {background: #fff;}
.sec4 dl {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
}
.sec4 dl dt,
.sec4 dl dd {width: 50%}
.sec4 dl dt {font-weight: bold;}
.sec4 dl .name {
    font-weight: bold;
    color: #e60012;
    letter-spacing: 0;
    font-family: 'Noto Sans Japanese';
    font-weight: 900;
    white-space: nowrap
}
@media screen and (max-width: 767px) {/*sp*/
    .sec4 {
        padding-bottom: 70px;
    }
    .sec4 .head {
        text-align: center;
        padding-top: 50px;
        margin-bottom: 50px;
    }
    .sec4 .head span {
        display: inline-block;
        background:url(../images/home/sec4_head_icon2.png)no-repeat left center/42px auto;
        height: 42px;
        line-height: 42px;
        padding-left: 67px;
    }
    .sec4 .block1 {
        font-size: 15px;
        line-height: 24px;
        margin-bottom: 56px;
    }
    .sec4 .block1 .box_sp {margin-bottom:100px}
    .sec4 .block1 .box {margin-bottom:50px}
    .sec4 dl dt,
    .sec4 dl dd{
        font-size: 18px;
        width:50%;
        padding:9px 0;
    }
    .sec4 .box .name {
        font-size: 33px;
    }
    .sec4 .box .flag.usa {
        background: url(../images/home/flag_usa.png)no-repeat left center/38px auto;
        padding-left: 58px;
        display: inline-block;
        min-height: 20px;
    }
	.sec4 .box .flag.uk {
        background: url(../images/home/flag_uk.jpg)no-repeat left center/38px auto;
        padding-left: 58px;
        display: inline-block;
        min-height: 20px;
    }
	.sec4 .box .flag.france {
        background: url(../images/home/flag_france.jpg)no-repeat left center/38px auto;
        padding-left: 58px;
        display: inline-block;
        min-height: 20px;
    }
	.sec4 .box .flag.al {
        background: url(../images/home/flag_al.jpg)no-repeat left center/38px auto;
        padding-left: 58px;
        display: inline-block;
        min-height: 20px;
    }
    .sec4 .box .ateji {
        margin: 28px auto 22px;
		text-align:center;
    }
    .sec4 .sign {margin: 0 auto 55px;}
    .sec4 .sign1 {max-width: 320px}
    .sec4 .sign2 {max-width: 288px}
    .sec4 .sign3 {max-width: 255px}
    .sec4 .sign_txt {
        padding: 0 20px;
        margin-bottom: 40px;
    }
    .sec4 .btn_order {
        margin-top: 50px;
    }
}
@media screen and (min-width: 768px) {/*pc*/
    .sec4 {
        padding-bottom: 220px
    }
    .sec4 .head {
        text-align: center;
        padding-top: 90px;
        margin-bottom: 100px;
    }
    .sec4 .head span {
        display: inline-block;
        background:url(../images/home/sec4_head_icon2.png)no-repeat left center/83px auto;
        height: 83px;
        line-height: 83px;
        padding-left: 132px;
    }
    .sec4 dl dt,
    .sec4 dl dd {
        width:50%;
        padding:5px 0;
    }
    .sec4 .box .name {
        font-size: 26px;
    }
    .sec4 .flag.usa {
        background: url(../images/home/flag_usa.png)no-repeat left center/30px auto;
        padding-left: 46px;
        display: inline-block;
        min-height: 15px;
    }
	.sec4 .flag.uk {
        background: url(../images/home/flag_uk.jpg)no-repeat left center/30px auto;
        padding-left: 46px;
        display: inline-block;
        min-height: 15px;
    }
	.sec4 .flag.france {
        background: url(../images/home/flag_france.jpg)no-repeat left center/30px auto;
        padding-left: 46px;
        display: inline-block;
        min-height: 15px;
    }
	.sec4 .flag.al {
        background: url(../images/home/flag_al.jpg)no-repeat left center/30px auto;
        padding-left: 46px;
        display: inline-block;
        min-height: 15px;
    }
    .sec4 .ateji {
        margin: 20px auto 20px;
    }
    .sec4 .block1 {
        display: flex;
        justify-content: space-between;
        background: url(../images/home/sec4_block1_line.png) no-repeat left top;
        padding-left: 20px;
        margin-bottom: 12px
    }
    .sec4 .block1 > div {
        background: url(../images/home/sec4_block1_line.png) no-repeat right top;
        width: 33.3%;
        padding: 12px 43px 2px 23px;
    }
    .sec4 .block2 {
        display: flex;
        justify-content: space-between;
        margin-top: 8px
    }
    .sec4 .block2 > div {
        background: url(../images/home/sec4_block2_line.png) no-repeat right top;
        width: 33.3%;
        padding: 0 15px 0 10px;
        display: flex;
        flex-direction: column;
    }
    .sec4 .block2 > div:last-of-type {
        background: none;
    }
    .sec4 .sign {
        min-height: 340px;
        padding-top: 10px;
        margin-left: auto;
        margin-right: auto;
    }
    .sec4 .sign1 {max-width: 318px}
    .sec4 .sign2 {max-width: 288px}
    .sec4 .sign3 {max-width: 256px}
    .sec4 .sign_txt {
        padding: 0 20px;
        margin-bottom: 40px;
    }
    .sec4 .block2 .btn_order {
        margin-top: auto;
    }
}


.sec5 {background:url(../images/home/sec5_bg.jpg)center top;color:#fff;}
.list_dot {}
.list_dot li {
    position: relative;
    padding-left: 1.0rem;
}
.list_dot li::before {
    content: "•";
    position: absolute;
    left: 0;
}
@media screen and (max-width: 767px) {/*sp*/
    .sec5 {
        background-size:100% auto;
        padding-bottom: 28px;
    }
    .sec5 .wrapper::before {
        background: url(../images/home/cloud3_sp.png);
        background-size: cover;
        width: 125px;
        height: 124px;
        top: -61px;
        left:0;
    }
    .sec5 .head {
        text-align: center;
        padding-top: 70px;
        margin-bottom: 40px;
    }
    .sec5 .box_wrap {}
    .sec5 .box {
        position: relative;
        margin-bottom: 45px;
    }
    .sec5 .box::after {
        content: "";
        width: 0;
	    height: 0;
        position: absolute;
        left: 0;
        right: 0;
        bottom: -40px;
        margin: auto;
        border: 11px solid transparent;
	    border-top: 19px solid #f0dd94;
    }
    .sec5 .box:last-of-type {margin-bottom:0}
    .sec5 .box:last-of-type::after {content:none}
    .sec5 .ttl {
        width: 80%;
        margin: 0 auto 18px;
    }
    .sec5 .txt_note {
        font-size: 15px;
        margin-top: 28px;
        margin-bottom: 18px;
    }
}
@media screen and (min-width: 768px) {/*pc*/
    .sec5 {padding-bottom: 50px;}
    .sec5 .wrapper::before {
        content: url(../images/home/cloud3.png);
        position: absolute;
        top: -162px;
        left:-287px;
    }
    .sec5 .head {
        text-align: center;
        padding-top: 80px;
        margin-bottom: 82px;
    }
    .sec5 .box_wrap {
        display: -webkit-flex; display: flex;
        -webkit-justify-content: space-between; justify-content: space-between;
    }
    .sec5 .box_wrap .box {
        position: relative;
        width: 229px
    }
    .sec5 .box::after {
        content: "";
        width: 0;
	    height: 0;
        position: absolute;
        top: 86px;
        right: -47px;
        border: 15px solid transparent;
	    border-left: 23px solid #f0dd94;
    }
    .sec5 .box:last-of-type::after {content:none}
    .sec5 .ttl {margin-bottom: 28px}
    .sec5 .txt_note {
        font-size: 24px;
        margin-bottom: 20px;
    }
}

.sec6 {background:#fff;}
@media screen and (max-width: 767px) {/*sp*/
    .sec6 {
        padding-bottom: 8px;
    }
    .sec6 .head {
        text-align: center;
        padding-top: 30px;
        margin-bottom: 30px;
    }
    .sec6 .head span {
        display: inline-block;
        background:url(../images/home/sec6_head_icon.png)no-repeat left center/42px auto;
        height: 42px;
        line-height: 42px;
        padding-left: 57px;
    }
    .sec6 .box_wrap .box {margin-bottom: 50px}
    .sec6 .box img {
        display: block;
        width: 98%;
        margin: auto;
    }
    .sec6 .ttl {
        text-align: center;
        font-size: 18px;
        margin-top: 22px;
        margin-bottom: 28px;
    }
}
@media screen and (min-width: 768px) {/*pc*/
    .sec6 {
        padding-bottom: 270px
    }
    .sec6 .head {
        text-align: center;
        padding-top: 52px;
        margin-bottom: 65px;
    }
    .sec6 .head span {
        display: inline-block;
        background:url(../images/home/sec6_head_icon.png)no-repeat left center/83px auto;
        height: 83px;
        line-height: 83px;
        padding-left: 114px;
    }
    .sec6 .box_wrap {
        display: -webkit-flex; display: flex;
        -webkit-justify-content: space-between; justify-content: space-between;
    }
    .sec6 .box_wrap .box {
        width: 251px;
    }
    .sec6 .ttl {
        text-align: center;
        margin-top: 25px;
        margin-bottom: 20px;
    }
}

.sec7 {background:url(../images/home/sec5_bg.jpg)center top;color:#fff;}
@media screen and (max-width: 767px) {/*sp*/
    .sec7 {
        background-size:100% auto;
        padding-bottom: 63px;
    }
    .sec7 .wrapper::before {
        background: url(../images/home/cloud4_sp.png);
        background-size: cover;
        width: 121px;
        height: 182px;
        top: -90px;
        right:0;
    }
    .sec7 .head {
        text-align: center;
        padding-top: 42px;
        margin-bottom: 20px;
    }
    .sec7 .price {
        width: 275px;
        margin: 0 auto 24px;
    }
    .sec7 .ttl {
        font-size: 18px;
        text-align: center;
        margin-top: 16px;
        margin-bottom: 16px;
    }
    .sec7 .list_card {
        display: flex;
        justify-content: space-between;
        width: 220px;
        margin: 0 auto 23px;
    }
    .sec7 .list_card li {
        width: 50px;
    }
    .sec7 .list_btn {
        display: flex;
        justify-content: space-between;
        width: 100%;
    }
    .sec7 .list_btn li {
        width: 48%;
    }
}
@media screen and (min-width: 768px) {/*pc*/
    .sec7 .wrapper {
        padding-left: 140px;
        padding-right: 140px;
        padding-bottom: 125px
    }
    .sec7 .wrapper::before {
        content: url(../images/home/cloud4.png);
        position: absolute;
        top: -146px;
        right:-256px;
    }
    .sec7 .head {
        text-align: center;
        padding-top: 115px;
        margin-bottom: 80px;
    }
    .sec7 .price {
        width: 547px;
        margin: 0 auto 58px;
    }
    .sec7 .ttl {
        font-size: 30px;
        text-align: center;
        margin-top: 56px;
        margin-bottom: 30px;
    }
    .sec7 .list_card {
        display: flex;
        justify-content: space-between;
        width: 450px;
        margin: 0 auto 67px;
    }
    .sec7 .list_card li {
        width: 102px;
    }
    .sec7 .list_btn {
        display: flex;
        justify-content: space-between;
        width: 100%;
    }
    .sec7 .list_btn li {
        width: 330px;
    }
    .sec7 .list_btn li img {
        width: 100%;
    }
}

.sec8 {background:#fff;}
@media screen and (max-width: 767px) {/*sp*/
    .sec8 {
        padding-bottom: 50px;
    }
    .sec8 .head {
        text-align: center;
        padding-top: 35px;
        margin-bottom: 30px;
    }
    .sec8 .list_img {
        display: flex;
        flex-wrap: wrap;
        justify-content: space-between;
        width: 100%;
    }
    .sec8 .list_img li {
        width: 48%;
        margin-bottom: 4%;
    }
    .sec8 address {
        margin-top: 17px
    }
	.sec8 .name {
        font-weight: bold;
		font-size:14px;
    }
	.sec8 .movie-wrap {
     margin-top:20px;
    }
}
@media screen and (min-width: 768px) {/*pc*/
    .sec8 {padding-bottom: 135px}
    .sec8 .head {
        text-align: center;
        padding-top: 70px;
        margin-bottom: 50px;
    }
    .sec8 .box_wrap {
        display: flex;
        justify-content: space-between;
        margin-bottom: 74px
    }
    .sec8 .list_img {
        display: flex;
        flex-wrap: wrap;
        justify-content: space-between;
        width: 466px;
    }
    .sec8 .list_img li {
        width: 224px;
        margin-bottom: 20px;
    }
    .sec8 .box_txt {
        width: 540px
    }
    .sec8 address {
        font-size: 16px;
        line-height: 24px;
        margin-top: 30px
    }
	.sec8 .name {
        font-weight: bold;
		font-size:16px;
    }
	.sec8 .movie-wrap {
     position: relative;
     padding-bottom: 56.25%; /*アスペクト比 16:9の場合の縦幅*/
     height: 0;
     overflow: hidden;
    }
    .sec8 .movie-wrap iframe {
     position: absolute;
     top: 0;
     left: 0;
     width: 100%;
     height: 100%;
	 }
}

.top {
    display: none;
    position: fixed;
    bottom: 30px;
    right: 10px;
	z-index: 2000;
	background-color: #023e75;
    text-align: center;
    color: #fff;
    font-size: 1.4rem;
    text-decoration: none;
    padding: 10px 15px;
	border-radius: 5px;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
	cursor: pointer;
}

.fixed {
    position: fixed;
    top: 0;
    width: 100%;
    z-index: 1000;
}

.sp-slide.sp-selected {opacity:1;}
.sp-slide {opacity:0.3;}
a.menu:hover img {opacity:1;}

.u-tube{
    position: relative;
    padding-bottom: 56.25%; /*16:9を維持*/
    height: 0;
    overflow: hidden;
    margin-bottom: 30px;
}
.u-tube iframe {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
} 