@charset "utf-8";

@import url(//maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css);
@import url(//use.fontawesome.com/releases/v5.0.6/css/all.css);
@import url("https://fonts.googleapis.com/css2?family=Zen+Maru+Gothic:wght@400;700&display=swap");

/*
	font-family:"FontAwesome";
	font-family:"Font Awesome 5 Free";
*/


/*========================================
 Base
========================================*/
html {font-size:62.5%;}
body {font-size:1.2rem;}


body{
    background:#9dd6e9;
    line-height:1.5;
}
#ContentsWrap{
    background:url(../images/fusen_img.png) center top no-repeat fixed, url(../images/checker_img.png) center top no-repeat fixed;
    background-size:100% auto;
}
.ColorRed {color:#f64e4e;}
.TxtCenter{
    margin-top:.6em;
    text-align:center;
}
.MarB1 {margin-bottom:1em;}


/* header */
header h1 {display:none;}
.bx-wrapper{
    background:none;
    margin-bottom:0;
    border:none;
}
section a {color:#e77ea6;}


/* PC */
@media screen and (min-width: 641px) {
.spOnly {display:none;}

/* header */
header{
    width:1080px;
    margin:0 auto;
    padding:30px 0 0;
}
header p{
    margin:4px 0 0;
    font-size:1.2rem;
    text-align:right;
}
.slideshow_box{
    width:1080px;
    height:350px;
    margin-bottom:10px;
}
/*.bxslider li {display:none;}
.bx-viewport .bxslider li {display: block !important;}*/
.bxslider, bxslider * {transition:initial;}

main{
    width:1080px;
    margin:0 auto;
}

section{
    background:#fff;
    margin-bottom:5rem;
    padding:2rem 0;
    border:2px solid #aaa;
}


/* Info */
section#Info{
    background:none;
    margin-bottom:3rem;
    border:none;
}
#Info .InfoTxt{
    font-size:2.2rem;
    font-weight:bold;
    color:#415f83;
    text-align:center;
}
#Info p{
    width:650px;
    margin:50px auto 0;
    text-align:center;
}
#Info p a {position:relative;}
#Info p a::before{
    font-family:"Font Awesome 5 Free";
    content:"\f138";
    margin-right:8px;
}
#Info p a::after {
    content:"";
    position:absolute;
    top:-21px;
    left:0;
    background:url("../images/btn_heart.png") no-repeat;
    width:650px;
    height:100px;
}
a.KakioroshiBtn{
    display:inline-block;
    background:#e77ea6;
    width:650px;
    height:35px;
    padding:6px 0 10px;
    font-size:2.8rem;
    font-weight:bold;
    color:#fff;
    text-align:center;
    border-radius:35px;
    text-decoration:none;
}
a.KakioroshiBtn:hover{
    opacity:0.7;
    transition:0.7s;
}


/* 各コンテンツ */
.SubTit{
    background:#415f83;
    width:100%;
    margin:8rem auto 24px;
    padding:8px 0 6px;
    font-size:3rem;
    font-weight:bold;
    color:#fff;
    text-align:center;
    letter-spacing:0.6rem;
}
.SubTit:first-of-type {margin-top:0;}
h2{
    position:relative;
    display:inline-block;
    background:#69c2be;
    margin:0rem 0 2rem -10px;
    padding:1rem 3rem 0.7rem;
    font-size:2.6rem;
    color:#fff;
    border-radius:0 100vh 100vh 0;
    box-shadow:3px 3px 5px rgba(0, 0, 0, .2);
}

h2::before{
    position:absolute;
    bottom:-10px;
    left:0;
    width:0;
    height:0;
    content:'';
    border-top:10px solid #3c9b97;
    border-left:10px solid transparent;
}
.SectionBox{
    width:1000px;
    margin:0 auto;
    font-size:1.4rem;
}

.SectionBox dl{
    display:flex;
    justify-content:center;
    flex-wrap:wrap;
    margin-bottom:20px;
}
.SectionBox dt{
    width:18rem;
    margin:0 0 6px;
    color:#e77ea6;
}
.SectionBox dt span{
    display:block;
    margin-right:1em;
    padding:0 1rem;
    border:1px solid #e77ea6 !important;
}
.SectionBox dd{
    width:calc(100% - 18rem);
    margin-bottom:6px;
}
.SectionBox dd li{
    margin-left:1rem;
    text-indent:-1rem;
    list-style:none;
}
.SectionBox dd li::before {content:"・";}
.SectionBox dd p {margin-bottom:0.8rem;}
.SectionBox .subTit{
    background:#e77ea6;
    width:900px;
    margin:0 auto;
    padding:2px 0;
    font-size:2rem;
    font-weight:bold;
    color:#fff;
    text-align:center;
}
.SectionBox .subTit:last-of-type {margin-top:1em;}
.SectionBox dd img {width:100%;}

.KinenPop{
    margin-bottom:2em;
    text-align:center;
}
.PopImg{
    display:block;
    text-align:center;
}
.PopImg2{
    display:block;
    margin-bottom:30px;
    text-align:center;
}

/* ボタン */
*, *::before, *::after {box-sizing:inherit;}
.BtnWrap{
    display:flex;
    justify-content:center;
    flex-wrap:wrap;
    width:1000px;
}
.btn, .btn2, .btn3{
    position:relative;
    display:inline-block;
    margin:0 2%;
    font-size:1.9rem;
    font-weight:700;
    text-align:center;
    line-height:1;
    vertical-align:middle;
    cursor:pointer;
    user-select:none;
    transition:all 0.3s;
    letter-spacing:0.1em;
    color:#212529;
    border-radius:0.5rem;
}
a.btn, .btn2, .btn3{
    overflow:hidden;
    background:#e77ea6;
    width:40%;
    padding:1.8rem 6rem 1.5rem;
    color:#fff;
    text-decoration:none;
    border-radius:0;
    box-sizing:border-box;
}
.btn2{
    display:block;
    width:54%;
    margin:0 auto;
}
.btn3{
    display:block;
    width:64%;
    margin:0 auto;
}
a.btn span, a.btn2 span, a.btn3 span {position:relative;}
a.btn::before, a.btn2::before, a.btn3::before{
    content:'';
    position:absolute;
    top:0;
    left:0;
    background:#69c2be;
    width:100px;
    height:100px;
    transition:all .5s ease-in-out;
    transform:translateX(-80%) translateY(-25px);
    border-radius:50%;
}
a.btn:hover::before, a.btn2:hover::before, a.btn3:hover::before{
    width:102%;
    height:400px;
    transform:translateX(-1%) translateY(-175px);
}


/* バーチャルオンリーショップ */
#VirtualOS .SectionBox dl {margin-top:1em;}
#VirtualOS .SectionBox dd li::before, #World .SectionBox dd li::before {content:"" !important;}


/* 限定商品 */
#LimitedItem .SectionBox ul{
    width:100%;
    margin-bottom:1em;
}
#LimitedItem .SectionBox li{
    margin-bottom:4px;
    list-style:none;
}
#LimitedItem .SectionBox li::before {content:"・";}


/* モーダル */
p.KakioroshiBtn{
    position:relative;
    display:block;
    background:#e77ea6;
    width:650px;
    height:35px;
    margin:20px auto 40px;
    padding:6px 0;
    font-size:2.8rem;
    font-weight:bold;
    color:#fff;
    text-align:center;
    border-radius:35px;
    text-decoration:none;
}
#PopupImg p.KakioroshiBtn::after {
    content:"";
    position:absolute;
    top:-21px;
    left:0;
    background:url("../images/btn_heart.png") no-repeat;
    width:650px;
    height:100px;
}

#PopupImg ul{
    display:flex;
    justify-content:center;
    align-items:flex-end;
    flex-wrap:wrap;
    width:100%;
    margin:0 auto 12px;
}
#PopupImg li{
    width:calc(100% / 4 - 10px);
    margin:0 4px 20px;
    text-align:center;
    vertical-align:bottom;
    list-style:none;
}
#PopupImg li img{
    width:100%;
    vertical-align:bottom;
    border:1px solid #ccc;
    box-sizing:border-box;
}

#PopupImg li p{
    background:#9dd6e9;
    padding:8px 0 4px;
    font-size:1.3rem;
    font-weight:bold;
    color:#000;
}
.TwBtn{
    margin-bottom:20px;
    font-size:1.6rem;
    font-weight:bold;
    text-align:center;
}
.TwBtn a{
    display:block;
    background:#e77ea6;
    width:500px;
    margin:0 auto;
    padding:6px 0;
    color:#fff;
    text-decoration:none;
    transition:0.5s;
}
.TwBtn a:hover {background:#69c2be;}


/* footer */
ul.copyright{
    display:flex;
    align-items:flex-end;
    flex-wrap:wrap;
    width:1080px;
    margin:0 auto;
    padding-bottom:12px;
}
ul.copyright li{
    margin-right:1em;
    list-style:none;
}


/* 海外 */
.WorldName{
    display:block;
    background:#e77ea6;
    margin-bottom:1em;
    padding:2px 0;
    font-size:1.8rem;
    font-weight:bold;
    color:#fff;
    text-align:center;
    letter-spacing:2rem;
}
.WorldSubtit {
    margin-bottom:4px;
    font-size:1.7rem;
    font-weight:bold;
    color:#69c2be;
}
#World .SectionBox div ul {list-style:none;}


}


/* アコーディオンメニュー */
.accordion_area{
    display:flex;
    flex-wrap:wrap;
    justify-content:flex-start;
    max-width:1080px;
    margin:14px auto;
}
.accordion_area .accordion_one._flex {width:calc(100% / 4);}
.accordion_one .accordion_header{
    position:relative;
    background-color:#fff;
    margin:0 1%;
    padding:14px 11% 14px 7%;
    font-size:2rem;
    font-weight:bold;
    color:#415f83;
    text-align:left;
    border:2px solid #415f83;
    z-index:+1;
    cursor:pointer;
    transition-duration:0.2s;
}
.accordion_one .accordion_header a, .accordion_one .accordion_header_one a{
    display:block;
    color:#415f83;
    text-decoration:none;
}
.accordion_one .accordion_header_one a::before{
    content:">";
    margin-right:0.5em;
}
.accordion_one .accordion_header_one{
    position:relative;
    background-color:#ebf7f7;
    margin:0 1%;
    font-size:1.7rem;
    font-weight:bold;
    color:#415f83;
    text-align:left;
    letter-spacing:-0.05rem;
    border:2px solid #415f83;
    border-top:none;
    z-index:+1;
    cursor:pointer;
}
.accordion_one .accordion_header_one.lsSmall {letter-spacing:-0.14rem;}
.accordion_one .accordion_header_one a{
    display:block;
    padding:8px 7%;
}
.accordion_one .accordion_header:hover, .accordion_one .accordion_header_one a:hover{
    background:#eee;
    opacity:.8;
}
.accordion_one .accordion_header .i_box{
    display:flex;
    justify-content:center;
    align-items:center;
    position:absolute;
    top:50%;
    right:5%;
    width:40px;
    height:40px;
    margin-top:-20px;
    box-sizing:border-box;
    transform:rotate(45deg);
    transform-origin:center center;
    transition-duration: 0.2s;
}
.accordion_one .accordion_header .i_box .one_i{
    position:relative;
    display:block;
    width:18px;
    height:18px;
    transform:rotate(45deg);
    transform-origin:center center;
    transition-duration:0.2s;
}
.accordion_one .accordion_header.open .i_box {transform: rotate(-360deg);}
.accordion_one .accordion_header .i_box .one_i:before, .accordion_one .accordion_header .i_box .one_i:after{
    display:flex;
    content:'';
    position:absolute;
    top:7px;
    left:0;
    background-color:#415f83;
    width:18px;
    height:4px;
    border-radius:10px;
    transform:rotate(0deg);
    transform-origin:center center;
}
.accordion_one .accordion_header .i_box .one_i:before{
    top:0;
    left:7px;
    width:4px;
    height:18px;
}
.accordion_one .accordion_header.open .i_box .one_i:before {content:none;}
.accordion_one .accordion_header.open .i_box .one_i:after {transform:rotate(-45deg);}
.accordion_one .accordion_inner{
    display:none;
    padding:0;
    box-sizing:border-box;
}
.accordion_one .accordion_inner .box_one {height:300px;}
.accordion_one .accordion_inner p.txt_a_ac {margin:0;}

@media screen and (max-width:1024px) {

.accordion_one .accordion_header {font-size:1.8rem;}
.accordion_one .accordion_header_one {font-size:1.8rem;}
.accordion_one .accordion_header .i_box{
    width:30px;
    height:30px;
    margin-top:-15px;
}

}


/* モーダル */
#cboxTitle {
    position:absolute;
    top:-22px;
    left:0;
    background:#9dd6e9;
    width:102%;
    padding-top:4px;
    font-size:1.5rem;
    color:#000;
    text-align:center;
}




/* スマホ */
@media screen and (max-width: 640px) {
.pcOnly {display:none;}

/* header */
header{
    width:100%;
    margin:12px auto;
}
header p{
    margin:4px 0 0;
    font-size:1.2rem;
    text-align:right;
}
.slideshow_box{
    display:block;
    width:100%;
    min-height:103px;
}
/*.bxslider li {display:none;}
.bx-viewport .bxslider li {display: block !important;}*/
.bxslider, bxslider * {transition:initial;}

main{
    width:96%;
    margin:0 auto;
}

section{
    background:#fff;
    margin-bottom:3rem;
    padding:1rem;
    border:2px solid #aaa;
}


/* Info */
section#Info{
    background:none;
    margin-bottom:2rem;
    border:none;
}
#Info .InfoTxt{
    font-size:1.6rem;
    font-weight:bold;
    color:#415f83;
    text-align:center;
}
#Info p{
    width:100%;
    margin:20px auto 0;
    text-align:center;
}
#Info p a {position:relative;}
#Info p a::before{
    font-family:"Font Awesome 5 Free";
    content:"\f138";
    margin-right:8px;
}
#Info p a::after {
    content:"";
    position:absolute;
    top:0;
    left:0;
    background:url("../images/btn_heart.png") no-repeat;
    background-size:100% auto;
    width:100%;
    height:60px;
}
a.KakioroshiBtn{
    display:inline-block;
    background:#e77ea6;
    width:96%;
    padding:10px 0;
    font-size:1.6rem;
    font-weight:bold;
    color:#fff;
    text-align:center;
    border-radius:35px;
    text-decoration:none;
}


/* アコーディオンメニュー */
.accordion_area {max-width:100%;}
.accordion_area .accordion_one._flex {width:calc(100% / 2);}
.accordion_one .accordion_header{
    padding:14px 11% 14px 7%;
    font-size:1.6rem;
}
.accordion_one .accordion_header{
    margin-top:8px;
    font-size:1.4rem;
    text-align:left;
    padding:15px 40px 15px 15px;
}
.accordion_one .accordion_header_one {font-size:1.3rem;}


/* 各コンテンツ */
.SubTit{
    background:#415f83;
    width:100%;
    margin:5rem auto 24px;
    padding:8px 0 6px;
    font-size:1.8rem;
    font-weight:bold;
    color:#fff;
    text-align:center;
    letter-spacing:0.4rem;
}
.SubTit:first-of-type {margin-top:0;}
h2{
    position:relative;
    display:inline-block;
    background:#69c2be;
    margin:0 0 2rem -21px;
    padding:0 3rem;
    font-size:1.6rem;
    color:#fff;
    border-radius:0 100vh 100vh 0;
    box-shadow:3px 3px 5px rgba(0, 0, 0, .2);
}
h2::before{
    position:absolute;
    bottom:-10px;
    left:0;
    width:0;
    height:0;
    content:'';
    border-top:10px solid #3c9b97;
    border-left:10px solid transparent;
}
.SectionBox{
    width:100%;
    margin:0;
    font-size:1.3rem;
}

.SectionBox dl {margin-bottom:20px;}
.SectionBox dt{
    width:100%;
    margin:0 0 6px;
    color:#e77ea6;
}
.SectionBox dt span{
    display:block;
    margin-bottom:4px;
    padding:4px 0;
    text-align:center;
    border:1px solid #e77ea6 !important;
}
.SectionBox dd{
    width:100%;
    margin-bottom:10px;
}
.SectionBox dd li{
    margin-left:1rem;
    text-indent:-1rem;
    list-style:none;
}
.SectionBox dd li::before {content:"・";}
.SectionBox dd p {margin-bottom:0.8rem;}
.SectionBox dd img {width:100%;}

.SectionBox .subTit + img {width:100%;}
.SectionBox .subTit{
    background:#e77ea6;
    padding:2px 0;
    font-size:1.4rem;
    font-weight:bold;
    color:#fff;
    text-align:center;
}
.SectionBox .subTit:last-of-type {margin-top:1em;}

.KinenPop{
    margin-bottom:2em;
    text-align:center;
}
.KinenPop img {width:100%;}

.PopImg{
    display:block;
    text-align:center;
}
.PopImg img, .PopImg2 img {width:100%;}
.PopImg2{
    display:block;
    text-align:center;
    margin-bottom:10px;
}


/* ボタン */
*, *::before, *::after {box-sizing:inherit;}
.BtnWrap {width:100%;}
.btn, .btn2, .btn3{
    position:relative;
    display:block;
    margin:0 2%;
    font-size:1.5rem;
    font-weight:700;
    text-align:center;
    line-height:1;
    vertical-align:middle;
    cursor:pointer;
    user-select:none;
    transition:all 0.3s;
    color:#212529;
    border-radius:0.5rem;
}
a.btn, a.btn2, a.btn3{
    overflow:hidden;
    background:#e77ea6;
    width:80%;
    margin:0 auto;
    padding:1.2rem 0;
    color:#fff;
    text-decoration:none;
    border-radius:0;
    box-sizing:border-box;
}
a.btn2, a.btn3{
    display: block;
    width: 100%;
    margin: 0 auto;
    padding:1.2rem 2.4rem;
}
a.btn span, a.btn2 span, a.btn3 span {position:relative;}
a.btn::before, a.btn2::before, a.btn3::before{
    content:'';
    position:absolute;
    top:0;
    left:0;
    background:#69c2be;
    width:100px;
    height:100px;
    transition:all .5s ease-in-out;
    transform:translateX(-80%) translateY(-30px);
    border-radius:50%;
}
a.btn2::before, a.btn3::before {top:6px;}

/*a.btn:hover::before{
    width:102%;
    height:400px;
    transform:translateX(-1%) translateY(-175px);
}*/


/* バーチャルオンリーショップ */
#VirtualOS .SectionBox dl {margin-top:1em;}
#VirtualOS .SectionBox dd li::before, #World .SectionBox dd li::before {content:"" !important;}


/* 限定商品 */
#LimitedItem .SectionBox ul{
    width:100%;
    margin-bottom:1em;
}
#LimitedItem .SectionBox li{
    margin-bottom:4px;
    list-style:none;
}
#LimitedItem .SectionBox li::before {content:"・";}


/* 海外 */
.WorldName{
    display:block;
    background:#e77ea6;
    margin-bottom:1em;
    padding:2px 0;
    font-size:1.7rem;
    font-weight:bold;
    color:#fff;
    text-align:center;
}
.WorldSubtit {
    margin-bottom:4px;
    font-size:1.7rem;
    font-weight:bold;
    color:#69c2be;
}
#World .SectionBox div ul {list-style:none;}


/* モーダル */
p.KakioroshiBtn{
    position:relative;
    display:inline-block;
    background:#e77ea6;
    width:96%;
    margin-bottom:12px;
    padding:10px 0;
    font-size:1.6rem;
    font-weight:bold;
    color:#fff;
    text-align:center;
    border-radius:35px;
    text-decoration:none;
}
#PopupImg p.KakioroshiBtn::after {
    content:"";
    position:absolute;
    top:0;
    left:0;
    background:url("../images/btn_heart.png") no-repeat;
    background-size:100% auto;
    width:100%;
    height:60px;
}

#PopupImg ul{
    width:100%;
    margin:0 auto 12px;
}
#PopupImg li{
    width:80%;
    margin:0 auto 20px;
    text-align:center;
    vertical-align:bottom;
    list-style:none;
}
#PopupImg li img{
    vertical-align:bottom;
    border:1px solid #ccc;
    box-sizing:border-box;
}

#PopupImg li p{
    background:#9dd6e9;
    padding:8px 0 4px;
    font-size:1.3rem;
    font-weight:bold;
    color:#000;
}
.TwBtn{
    margin-bottom:20px;
    font-size:1.5rem;
    font-weight:bold;
    text-align:center;
}
.TwBtn a{
    display:block;
    background:#e77ea6;
    width:80%;
    margin:0 auto;
    padding:6px 0;
    color:#fff;
    text-decoration:none;
    transition:0.5s;
}


/* footer */
ul.copyright{
    display:flex;
    align-items:flex-end;
    flex-wrap:wrap;
    width:96%;
    margin:0 auto 12px;
}
ul.copyright li{
    margin-right:1em;
    list-style:none;
}

}



/* topへ戻る */
#footerGroup #totop{
    width:40px;
    height:40px;
    padding:0;
    text-indent:-9999px;
    background-color:#0079c7;
    border-radius:100%;
    position:fixed;
    bottom:10px;
    right:0;
    z-index:800;
    display:none;
    cursor:pointer;
}
#footerGroup #totop a {display:block;}
#footerGroup #totop::after{
    content:"\f106";
    font-family:"FontAwesome";
    font-size:40px;
    line-height:35px;
    text-indent:0;
    text-align:center;
    color:#fff;
    display:block;
    position:absolute;
    top:0;
    left:0;
    right:0;
}