@charset "utf-8";
/*
	Last Update:2021/11/21
	Auther: okada
*/
/*===================================================================
	layout
===================================================================*/
a:link { color:#000; }
a:visited { color:#000; }

.wrapper, .wrapper-t, .wrapper-b { position:relative; }
@media (max-width: 767px){
	.wrapper, .wrapper-t { padding-top:50px; }
	.wrapper, .wrapper-b { padding-bottom:50px; }
}
@media (min-width: 768px){
	.wrapper, .wrapper-t { padding-top:110px; }
	.wrapper, .wrapper-b { padding-bottom:110px; }
}

.center, .center2,.center3 { width:100%; margin:0 auto; text-align:left; }
.center { max-width:1100px; }
.center2 { max-width:960px; }

	@media (max-width:1130px){
		.center { padding-left:15px; padding-right:15px; }
	}
	@media (max-width:990px){
		.center2 { padding-left:15px; padding-right:15px; }
	}

.mincho { font-family:"Noto Serif JP","ヒラギノ明朝 ProN W3","Hiragino Mincho ProN","Sawarabi Mincho","游明朝","YuMincho","HG明朝E","ＭＳ Ｐ明朝","ＭＳ 明朝",serif; }

body { color:#fff; }
body.colorbox_open{overflow-y: hidden;}

/*===================================================================
	#head
===================================================================*/
#head{position: fixed; z-index: 999; width: 100%; transition:.2s; }
@media (max-width:767px) {
	#base:not(.open) #head._hide { pointer-events:none; opacity:0; }
}
#head.fixed{ background:rgba(0,0,0,.5); box-shadow:0 4px 16px rgba(0,0,0,.16); }
.head { display: flex; justify-content: space-between; align-items: center; position: relative; z-index: 10; width: 100%;
}

#head .head .left{padding:15px 15px 15px 20px;}
#head .left{ display: flex; justify-content: center; align-items: center; }
#head .left img{ width: 221px; object-fit: contain;}

#head h1{position: relative; display: flex; justify-content: center; align-items: center;}
#head h1 a{display: block; width:160px; }
#head h1 p{color: #707070; font-size: 0.8em; line-height: 1.15em; letter-spacing: -2px; margin-left: 5px;}

#head .head .right{ padding: 20px 20px 20px 30px; border-radius: 0 0 0 30px;}
#head .right{ display: flex; justify-content: center; align-items: center;}
#head .right ul.navi{	display: flex; flex-wrap:wrap; padding-right:10px; }
#head .right ul.navi li{ padding:0 10px; }
#head .right ul.navi li a { color:#fff; }

/*cart_btn*/
#cart_btn { display: flex; justify-content: center;  z-index: 9999; width: 60px; height: 60px;}
#cart_btn > a {padding: 20px 0; background: url(../image/layout/head/cart.png) no-repeat center /contain; display: block; position: relative; }
#cart_btn a > span { visibility:hidden; }
#cart_btn a > .alert_num { right: -5px; top: 0px; width: 23px; height: 23px; font-size: 1em; }

#btn_open { display:none; }
@media (max-width:991px) {
	#head .right ul.navi { position:absolute; top:100px; left:0; width:100%; display:flex; flex-direction:column; width:100%; background:rgba(0,0,0,.5); padding:0; box-shadow:0 4px 4px rgb(0 0 0 / 16%); }
	#head .right ul.navi li { border-top:1px dashed #ccc; padding:0; }
	#head .right ul.navi li a { width:100%; padding:10px 20px; display:block; }
	#btn_open { display:block; padding-left:15px; }
	#btn_open a { width:50px; height:50px; display:block; }
	#btn_open a .bar_wrap { position:relative; width:100%; height:100%; }
	#btn_open a .bar_wrap .bar { position:absolute; width:40px; height:3px; background:#fff; top:50%; left:50%; transform:translate(-50%, -50%); }
	#btn_open a .bar_wrap::before,
	#btn_open a .bar_wrap::after { content:""; position:absolute; width:40px; height:3px; background:#fff; left:50%; transform:translate(-50%, -50%); }
	#btn_open a .bar_wrap::before { top:30%; }
	#btn_open a .bar_wrap::after { top:70%; }
	#base.open #btn_open a .bar_wrap .bar { display:none; }
	#base.open #btn_open a .bar_wrap::before,
	#base.open #btn_open a .bar_wrap::after { width:calc(40px * 1.14 ); top:50%; }
	#base.open #btn_open a .bar_wrap::before { transform:translate(-50%, -50%) rotate(-45deg); }
	#base.open #btn_open a .bar_wrap::after { transform:translate(-50%, -50%) rotate(45deg); }
	#base:not(.open) #head .right ul.navi { display:none; }
	#head .right ul.navi { top:90px; }
}
@media (max-width:767px) {
	#head .left img{ width:120px; }
}
@media (max-width:575px) {
	#cart_btn a > .alert_num{top: -10px;}
	#cart_btn{width: 50px; height: 50px;}
	#head h1 p{display: none;}
}

/*===================================================================
	#foot
===================================================================*/

#foot{padding:50px 15px; background:#F5F5F5; color:#000; }
#foot #pagetop img{ z-index: 500;}
#copyright{ font-size: 13px;}
#foot .navi a{color: #707070; display: block; text-align: center;}
#foot .Instagram{width:40px; margin-left: auto;}
#foot .foot_link_list { display:flex; align-items:center; flex-wrap:wrap; justify-content:flex-end; }
#foot .foot_link_list .unit:not(:last-child) { padding-right:20px; }

@media(min-width:768px){
	#foot .navi .li:not(:first-child) {border-left: 1px solid #C3C3C3;}
}
@media(min-width:576px){
	#foot .Instagram{text-align: right;}
}
@media(max-width:575px){
#foot #pagetop{margin-bottom: 20px;}
}

/*===================================================================
	color
===================================================================*/
.bg_gray{background-color: #F5F4F3;}
.bg_1 { background:url(../image/layout/back1.jpg) no-repeat center center / cover; }
.bg_1-loop { background:url(../image/layout/back1-loop.jpg) repeat-y top center / 100% auto; }
.bg_2 { background:url(../image/layout/back2.jpg) no-repeat center center / cover; }
.bg_2-loop { background:url(../image/layout/back2-loop.jpg) repeat-y top center / 100% auto; }

/*===================================================================
	dots
===================================================================*/
#body .slick-dots li{width: 30px;}
#body .slick-dots li button:before{width: 14px; height: 14px;}
#body .slick-dots li.slick-active button:before{content:""; background: linear-gradient(180deg, rgba(223,0,134,1) 0%, rgba(55,0,96,1) 100%); border-radius: 30px; width: 17px; height: 17px; margin:4px;}
#body .slick-prev:before{content: "none"; background: url(../image/layout/icon/modal-l.png) no-repeat 0 0; position:absolute; top: 0; left: 15px; font-size:0px;}
#body .slick-next:before{content: "none"; background: url(../image/layout/icon/modal-r.png) no-repeat 0 0; position:absolute; top: 0; right: 15px; font-size:0px;}
@media (max-width: 767px){
	#body .slick-prev:before, #body .slick-next:before{width: 45px; height:45px; background-size:45px;}
}
@media (min-width: 768px){
	#body .slick-prev:before, #body .slick-next:before{width: 60px; height:60px; background-size:60px;}
}

#body .items_slide_main .slick-dots { bottom:30px; height:27px; display:flex; align-items:center; justify-content:center; }
#body .items_slide_main .slick-dots li { width:27px; }
#body .items_slide_main .slick-dots li button { padding:0; width:27px; height:27px; }
#body .items_slide_main .slick-dots li button::before { content:""; border-radius:30px; width:15px; height:15px; margin:4px; border:2px solid #fff; }
#body .items_slide_main .slick-dots li.slick-active button::before { background:#fff; }
@media (max-width:991px) {
	#body .items_slide_main .slick-dots { bottom:20px; }
}

/*===================================================================
	common
===================================================================*/
.hl_1{ line-height:1.2; display:flex; flex-direction:column; align-items:flex-start; margin-bottom:30px; }
.hl_1 .sub{font-size: 1.25em; color:#D6D6D6; display:inline-block; padding:5px 10px; border-bottom:1px solid #D6D6D6; font-weight:bold; }
.hl_1 .main{ color:#fff; font-size:3em; font-weight:600; letter-spacing:3px; }
@media (max-width:575px) {
	.hl_1 .sub{ font-size: 1em; }
	.hl_1 .main { font-size:2em; }
}
.hl_2 { display:flex; flex-direction:column; align-items:center; margin-bottom:40px; }
.hl_2 .sub { display:inline-block; color:#D6D6D6; font-weight:bold; border-bottom:1px solid #D6D6D6; font-size:1.2em; margin-bottom:10px; }
.hl_2 .main { font-size:2em; font-weight:bold; letter-spacing:2px; text-indent:2px; text-align:center; }
@media (max-width:767px) {
	.hl_2 .main { font-size:1.5em; letter-spacing:1px; text-indent:1px; }
}

.marker_1{    background: linear-gradient(transparent 60%, #FBE6F0 60%);}
.marker_2{    background: linear-gradient(transparent 60%, #E5F2DE 60%);}
.marker_3{    background: linear-gradient(transparent 60%, #FBDDC6 60%);}
.marker_4{    background: linear-gradient(transparent 60%, #EFF9FD 60%);}
.marker_5{    background: linear-gradient(transparent 60%, #ECE9F4 60%);}
.marker_6{    background: linear-gradient(transparent 60%, #FAF7CC 60%);}

.alert_num{     position: absolute;
    top: -15px;
    right: -15px;
    background: #EF3749;
    color: #fff;
    font-weight: bold;
	width: 35px;
    height: 35px;
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: 50px;
    font-size: 1.25em;}

.btn_1 { display:inline-block; max-width:300px; width:100%; padding:15px 10px; background:#fff no-repeat center right 15px / 6px auto; border:1px solid #9F9F9F; border-width:1px 0; text-align:center; }
.btn_1._next { background-image:url(../image/layout/icon/arrow_r-g.png); }
.btn_1 .main { color:#9F9F9F; font-weight:600; font-size:1.2em; }
.btn_1._disabled { pointer-events:none; }

.btn_2 { display:inline-block; max-width:300px; width:100%; padding:15px 10px; background:#fff no-repeat center right 15px / 6px auto; border:1px solid #fff; border-width:1px 0; text-align:center; background-color:rgba(0,0,0,.5); }
.btn_2._next { background-image:url(../image/layout/icon/arrow_r-w.png); }
.btn_2 .main { color:#fff; font-weight:600; font-size:1.2em; }
.btn_2._disabled { pointer-events:none; }


.box { background: #fff; width: 100%; box-shadow: 0 1px 3px rgb(0 0 0 / 16%); padding: 15px;}

.tbl_form { width:100%; }
.tbl_form tr > * { vertical-align:middle; padding:15px 10px; border-top:1px solid #ccc; }
.tbl_form tbody th { background:#F8F8F8; position:relative; }
.tbl_form tbody th label { display:inline-block; width:100%; position:relative; }
.tbl_form .form-zip .zip dt{margin-right: 5px;}
.tbl_form .form-zip .zip button{background: #FAFAFA;
    border: 1px solid #666666;
    border-radius: 50px;
    padding: 5px 10px;}


	.tbl_form .form-zip .zip,.tbl_form .form-zip .zip dd{display: flex; align-items: center;}
	.tbl_form tr > * { border-bottom:1px solid #ccc; }
	.tbl_form tbody tr > th { width:200px; padding:20px 10px;    text-align: center; }
	.tbl_form .cap { padding-top:15px; }


#cboxContent{border-radius: unset!important;}

@media (max-width:767px) {
	.tbl_form tbody tr > th { width:100px; }
}
/*===================================================================
	icon
===================================================================*/
.icon { display:inline-block; line-height:100%; background-repeat:no-repeat; background-size:contain; background-position:left center; }

.icon_i1 { background-image:url(../image/layout/icon/right.png); background-size:8px; background-position: right 10px center; padding: 10px 15px 10px 0px; }
.icon_i2 { background-image:url(../image/layout/icon/instagram.png); background-size:20px; background-position:left center; padding: 5px 0px 5px 30px; }
.icon_i3 { background-image:url(../image/layout/icon/cart.png); background-size:20px; background-position:left center; padding: 5px 0px 5px 30px; }
.icon_i4 { background-image:url(../image/layout/icon/cart2.png); background-size:20px; background-position:left center; padding: 5px 0px 5px 25px; }
.icon_i5 { background-image:url(../image/layout/icon/i5.png); background-size:20px; background-position:left center; padding: 5px 0px 5px 30px; }
.icon.insta { background-image:url(../image/layout/icon/insta.png); background-size:20px; background-position:left center; padding: 5px 0px 5px 30px; }


/*===================================================================
	common
===================================================================*/
.mb0 { margin-bottom:0 !important; }
.mb5 { margin-bottom:5px !important; }
.mb10 { margin-bottom:10px !important; }
.mb15 { margin-bottom:15px !important; }
.mb20 { margin-bottom:20px !important; }
.mb30 { margin-bottom:30px !important; }
.mb40 { margin-bottom:40px !important; }
.mb50 { margin-bottom:50px !important; }

.mt10 { margin-top:10px !important; }
.mt20 { margin-top:20px !important; }
.mt30 { margin-top:30px !important; }
.p0 { padding:0 !important; }

.disp_b { display:block; }
.disp_ib { display:inline-block; }
.disp_tbl { display:table; width:100%; height:100%; }
.disp_td { display:table-cell; vertical-align:middle; }
.disp_td_b { display:table-cell; vertical-align:bottom; }

.img_back { background-position:center center; background-repeat:no-repeat; background-size:cover; overflow:hidden; }
.img_back > img { visibility:hidden; width:1px; height:1px; }
.img_rect { padding-top:65%; line-height:1px; }
.img_rect_1 { padding-top:46%; line-height:1px; }
.img_sq { padding-top:100%; line-height:1px; }

.parallax,
.parallax:before,
.parallax:after { transition:opacity .7s, transform .7s, left .7s, right .7s; }
.parallax[data-parallax-in="vertical"],
.parallax[data-parallax-in="vertical2"],
.parallax[data-parallax-in="vertical3"] { opacity:1; transform:translateY(0); -webkit-transform:translateY(0); -ms-transform:translateY(0); }
.parallax[data-parallax-in="vertical"]:not(.parallax_on),
.parallax[data-parallax-in="vertical2"]:not(.parallax_on),
.parallax[data-parallax-in="vertical3"]:not(.parallax_on) { opacity:0 !important; }
.parallax[data-parallax-in="vertical"]:not(.parallax_on) { transform:translateY(30px); -webkit-transform:translateY(30px); -ms-transform:translateY(30px); }
.parallax[data-parallax-in="vertical2"]:not(.parallax_on) { transform:translateY(60px); -webkit-transform:translateY(60px); -ms-transform:translateY(60px); }
.parallax[data-parallax-in="vertical3"]:not(.parallax_on) { transform:translateY(90px); -webkit-transform:translateY(90px); -ms-transform:translateY(90px); }
.parallax[data-parallax-in="left"] { position:relative; left:0; }
.parallax[data-parallax-in="left"]:not(.parallax_on) { left:-100vw; }
.parallax[data-parallax-in="right"] { position:relative; right:0; }
.parallax[data-parallax-in="right"]:not(.parallax_on) { right:-100vw; }

.parallax[data-parallax-in="slide_right"],
.parallax[data-parallax-in="slide_left"] { display:inline-block; position:relative; }
.parallax[data-parallax-in="slide_right"] > *,
.parallax[data-parallax-in="slide_left"] > * { position:relative; display:block; transform:translateX(0vw); transition:all .5s; transition-delay:.4s; }
.parallax[data-parallax-in="slide_right"]:before,
.parallax[data-parallax-in="slide_left"]:before { content:""; position:absolute; top:0; width:100%; height:100%; background:#9CB5A7; transition:all .5s; }
.parallax[data-parallax-in="slide_right"]:before { right:0; }
.parallax[data-parallax-in="slide_left"]:before { left:0; }
.parallax[data-parallax-in="slide_right"]:not(.parallax_on):before,
.parallax[data-parallax-in="slide_left"]:not(.parallax_on):before { width:0%; }
.parallax[data-parallax-in="slide_right"]:not(.parallax_on)  > * { transform:translateX(100vw); }
.parallax[data-parallax-in="slide_left"]:not(.parallax_on)  > * { transform:translateX(-100vw); }

.parallax[data-parallax-in="zoom_in"],
.parallax[data-parallax-in="zoom_out"] { opacity:1; transform:scale(1); }
.parallax[data-parallax-in="zoom_in"]:not(.parallax_on) { opacity:0; transform:scale(.95); }
.parallax[data-parallax-in="zoom_out"]:not(.parallax_on) { opacity:0; transform:scale(1.05); }


/* オーバーレイ */
.overlay {
  /* 位置を固定 */
  position: fixed;
  top: 0;
  left: 0;
  /* 画面いっぱいに広がるようにする */
  width: 100%;
  height: 100vh;
  /* rgbaを使って60%の黒いオーバーレイにする */
  background: rgba(0, 0, 0, 0.6);
  /* デフォルトでは見えないようにする */
  opacity: 0;
  visibility: hidden;
  /* 表示する際の変化の所要時間 */
  transition: .3s;
	z-index:1000;
}

/* activeクラスのついたオーバーレイ */
.overlay.active {
  /* activeクラスがついたときにオーバーレイを表示する */
  opacity: 1;
  visibility: visible;
}

/* モーダルウィンドウ */
.modal { max-width:1000px; width: 85vw; background: #fff; position: fixed; top: 50%; left: 50%; transform: translate(-50%, -50%); transition: .3s; z-index: 9999; padding-top:50px; opacity: 0; visibility: hidden; }
@media (max-width:767px) {
	.modal { top:calc(50% - 20px); width:calc(100% - 40px); }
}

.modal .modal_wrap{ height: calc(85vh - 50px); overflow-y:auto; overflow-x:hidden; }
.modal .text_unit{padding: 15px 20px 30px;}
.modal .text_unit .item_name { display:flex; flex-direction:column; font-weight:bold; font-size:1.5em; margin-bottom:20px; }
@media (max-width:767px) {
	.modal .modal_wrap { height:calc(85vh - 150px); }
	.modal .text_unit { padding-left:10px; padding-right:10px; }
	.modal .text_unit .item_name { font-size:1.25em; }
}

.modal .modal_wrap .image .youtube_wrap { width:100%; height:0; position:relative; }
.modal .modal_wrap .image .youtube_wrap > lite-youtube { position:absolute; top:0; left:0; width:100%; height:100%; max-width:100%; background-size:contain!important; background-repeat:no-repeat!important; background-position:center center!important; background-color:#000!important; }

.modal .tbl_1{display: table; width: 100%; border-left: 1px solid #ccc; border-right:1px solid #ccc; }
.modal .tbl_1 th , .modal .tbl_1 td{padding: 15px 15px; border-top: 1px solid #ccc; border-bottom: 1px solid #ccc;}
.modal .tbl_1 th{text-align:center; background-color:#F8F8F8; min-width:200px; }
.modal .tbl_1 td{padding-left: 15px; width:80%;}

@media (max-width: 767px){
	.modal .tbl_1 { border-bottom:1px solid #ccc; }
	.modal .tbl_1 tr > * { display:block; width:100%; border-bottom:0; }
}

.modal .items_wrap {border-top:1px solid #ccc; margin-bottom:40px; }
.modal .items_wrap .item_box{ padding: 10px 0;}
.modal .item_box .num{width: 110px;}
.modal .third_unit .btn_wrap .goto_cart { width:100%; text-align:center; border-color:#2C2E33; background:#2C2E33 url(../image/layout/icon/right.png) no-repeat center right 10px / 6px auto; color:#fff; border-radius:3px; padding:10px 15px; font-weight:600; }
.modal .third_unit .close2 .main { color:#797979; font-weight:600; text-decoration:underline; }
.modal .third_unit .close2:hover .main { text-decoration:none; }
@media (max-width:767px) {
	.modal .item_box .img { width:80px!important; }
}

/* activeクラスのついたモーダルウィンドウ */
.modal.active {
  opacity: 1;
  visibility: visible;
}

/* モーダルウィンドウ内の閉じるボタン */
.modal .close { position: absolute; top:25px; right:20px; transform:translateY(-50%); width:100%; cursor: pointer; font-size: 20px; height:50px; text-align:center; display:flex; flex-direction:row; align-items:center; justify-content:center; background:url(../image/layout/icon/cross.png) no-repeat center center / 20px auto; width:20px; height:20px; }
.modal .modal_head { position: absolute; top: 0; left: 0; width:100%; background: #2C2E33; font-size: 20px; height:50px; text-align:center; display:flex; flex-direction:row; align-items:center; justify-content:center; }
.modal .modal_head .main { color:#fff; background:url(../image/layout/icon/cart2.png) no-repeat center left / 25px auto; padding-left:35px; }
.modal .slick-arrow { width:60px; height:60px; background-size:60px auto; opacity:.75; }
.modal .slick-arrow:hover { opacity:1; }
.modal .slick-arrow.slick-prev { background-image:url(../image/layout/icon/modal-l.png); }
.modal .slick-arrow.slick-next { background-image:url(../image/layout/icon/modal-r.png); }
.modal .slick-arrow::before { display:none; }
@media (max-width:767px) {
	.modal .modal_head { font-size:1em; }
	.modal .modal_head .main { background-size:20px auto; padding-left:25px; }
	.modal .close { right:15px; }
	.modal .slick-arrow { width:30px; height:30px; background-size:30px auto; }
}

.modal h2 {
  font-size: 18px;
  font-weight: normal;
  margin-bottom: 10px;
}

.no_scroll {
  overflow: hidden;
}

.modal .item_box .img{width: 120px;}

@media (max-width: 991px){
    .modal .hl_2{font-size: 1.5em;}
}

/* cart */
.cart_contain .delete { background:transparent; border:0; color:#797979; text-decoration:underline; font-weight:500; }
.cart_contain .delete:hover { text-decoration:none; }
.cart_contain .btn_wrap a { display:block; width:100%; color:#fff; text-align:center; font-weight:500; }