@charset "UTF-8";
@media screen and (min-width: 768px) {
	.header { background: rgba(255, 255, 255, 1)!important; }
}
.bread	{ width: 980px; margin-left: auto; margin-right: auto; }
#contents { width: auto; }
#pisss	{ max-width: 1200px; }
#pi { width: 100%!important; max-width: 1200px; }
#pi > img { display: none!important; }
.bannerSwitch img	{ width: 100%; line-height: 1; }
.pi_description	{ padding: 0!important; max-width: 1200px; }
.pi_lgzformat	{ display: block; width: 100%; padding: 0; margin: 0 0 100px; }
.pi_lgzformat *	{ font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,"Noto Sans",sans-serif;font-weight:500;line-height:1.75;-webkit-text-size-adjust:100%;;color:#000000;-webkit-font-smoothing: antialiased; }
.pi_lgzformat ul:before, 
.pi_lgzformat ol:before, 
.pi_lgzformat dl:before, 
.pi_lgzformat .clearfix:before, 
.pi_lgzformat ul:after, 
.pi_lgzformat ol:after, 
.pi_lgzformat dl:after, 
.pi_lgzformat .clearfix:after { display: none; }
.pi_lgzformat *	{ color:#303030; -webkit-font-smoothing: antialiased; font-feature-settings: "palt"; -webkit-font-feature-settings: "palt"; box-sizing: border-box; }
.pi_lgzformat a { transition: all .3s; color:#000; }
.pi_lgzformat a:hover { opacity:0.7; color:#000; text-decoration:none; }
.pi_lgzformat .small {font-size:80%;}
.pi_lgzformat img	{ width: 100%; line-height: 1; }
@media (orientation: portrait) and (max-width: 829px)	{ 
	.pi_lgzformat	{ padding: 0; margin: 0 0 60px; }
}
/* ------------ FADEIN ------------- */
.invitem	{ opacity : 0; transform : translate(0, 20px); transition: all 1s; }
.invitem.inview	{ opacity : 1; transform : translate(0, 0); }
.delay01	{ transition-delay: .1s; }
.delay02	{ transition-delay: .2s; }
.delay03	{ transition-delay: .3s; }
.delay04	{ transition-delay: .4s; }
.delay05	{ transition-delay: .5s; }
.delay06	{ transition-delay: .6s; }
.delay07	{ transition-delay: .7s; }
.delay08	{ transition-delay: .8s; }
/* ------------ INTRODUCTION ------------- */
.hh_header	{ display: -webkit-flex; display: flex; flex-direction: column; align-items: center; padding: 80px 20px; margin: 0; }
.hh_header > strong	{ color:#000; font-size: 12px; font-weight: 700; line-height: 1; padding: 0; margin: 0; }
.hh_header > h1	{ font-size: 40px; font-weight: 700; line-height: 1; padding: 0 0 30px; margin: 20px 0 0; }
.hh_header > h1 > br	{ display: none; }
.hh_header > p	{ font-size: 20px; font-weight: 500; line-height: 2; padding: 10px 0 0; margin: 0; text-align: center; }
.hh_header > p > b	{ font-weight: 700; }
@media screen and (max-width: 767px) {
	.hh_header > strong	{ font-size: 10px; }
	.hh_header > h1	{ text-align: center; font-size: 28px; line-height: 1.4; padding: 0 0 30px; margin: 16px 0 0; }
	.hh_header > p	{ text-align: left; font-size: 14px; padding: 0; }
	.hh_header > h1 > br	{ display: inline-block; }
	.hh_header > p > br	{ display: none; }
}
.original_box	{ display: -webkit-flex; display: flex; justify-content: space-between; padding: 60px; margin: 0 0 100px; background-color: #f3f3f3; }
.original_box_img	{ width: calc(50% - 25px); }
.original_box_txt	{ width: calc(50% - 25px); display: -webkit-flex; display: flex; flex-direction: column; justify-content: space-between; }
@media screen and (max-width: 767px) {
	.original_box	{ padding: 0; margin: 0; flex-wrap: wrap; }
	.original_box_img	{ width: 100%; }
	.original_box_txt	{ width: 100%; padding: 38px 20px; margin: 0; }
}
.original_box_txt_hd > h2	{ font-size: 25px; font-weight: 700; line-height: 32px; padding: 0; margin: 0 0 20px; letter-spacing:.05rem; }
.original_box_txt_hd > p	{ font-size: 18px; font-weight: 400; line-height: 28px; padding: 0; margin: 0; }
.original_box_txt_con	{ padding: 20px 0; margin: 0; }
.original_box_txt_con > strong	{ display: block; font-size: 14px; font-weight: 700; line-height: 1; padding: 0; margin: 0 0 15px; letter-spacing:.05rem; }
.original_box_txt_con > p	{ display: block; font-size: 22px; font-weight: 400; line-height: 1; padding: 0; margin: 0; letter-spacing:.05rem; }
.original_box_txt_con > p > span	{ display: block; font-size: 12px; font-weight: 400; line-height: 1; padding: 15px 0 0; margin: 0; }
.original_box_txt_ft > strong	{ display: block; font-size: 14px; font-weight: 700; line-height: 1; padding: 0; margin: 0 0 15px; letter-spacing:.05rem; }
.original_box_txt_ft > p	{ display: block; font-size: 12px; font-weight: 400; line-height: 20px; padding: 0; margin: 0; }
@media screen and (max-width: 767px) {
	.original_box_txt_hd > h2	{ font-size: 20px; line-height: 24px; margin: 0 0 16px; }
	.original_box_txt_hd > p	{ font-size: 14px; line-height: 21px; }
	.original_box_txt_con	{ padding: 24px 0 26px; }
	.original_box_txt_con > strong	{ font-size: 11px; margin: 0 0 10px; }
	.original_box_txt_con > p	{ font-size: 16px; line-height: 1.2; }
	.original_box_txt_con > p > span	{ font-size: 10px; padding: 10px 0 0; }
	.original_box_txt_ft > strong	{ font-size: 11px; margin: 0 0 10px; }
	.original_box_txt_ft > p	{ font-size: 10px; line-height: 17px; }
}
.gift_wrapping	{ padding: 0 60px; margin: 0 0 100px; }
.gift_wrapping > h2	{ font-size: 26px; font-weight: 700; line-height: 1; padding: 0; margin: 0 0 100px; letter-spacing:.05rem; text-align: center; }
.gift_wrapping_wap1,
.gift_wrapping_wap2	{ display: -webkit-flex; display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; }
.gift_wrapping_wap1	{ margin: 0 0 50px; }
.giwp_img,
.giwp_txt	{ width: calc(50% - 25px); position: relative; }
.giwp_txt > h3	{ font-size: 22px; font-weight: 700; line-height: 1; letter-spacing:.05rem; padding: 0 0 16px; }
.giwp_txt > h4	{ font-size: 20px; font-weight: 400; line-height: 1; letter-spacing:.05rem; padding: 0 0 30px; }
.giwp_txt > p	{ font-size: 16px; font-weight: 400; line-height: 26px; }
.giwp_txt > p > a	{ text-decoration: underline; font-weight: 700; }
@media screen and (min-width: 768px) {
	.giwp_img .number01	{ position: absolute; z-index: 1; top:-50px; left:40px; width: 100px; }
	.giwp_img .number02	{ position: absolute; z-index: 1; top:-50px; right:40px; width: 100px; }
	.giwp_img .number03	{ display: none; }
	.im01	{ order:2; margin: 0 0 20px; }
	.tx01	{ order:1; margin: 0 0 20px; }
	.im02	{ order:4; }
	.tx02	{ order:3; }
	.giwp_txt > p > a:hover	{ text-decoration: none; color:#000; }
}
@media screen and (max-width: 767px) {
	.gift_wrapping	{ padding: 0 20px; margin: 0; }
	.gift_wrapping > h2	{ font-size: 20px; margin: 0; padding: 75px 0; }
	.gift_wrapping_wap1	{ margin: 0; }
	.gift_wrapping_wap2	{ padding-top: 50px; border-top: 2px solid #f3f3f3; }
	.giwp_img,
	.giwp_txt	{ width: 100%; }
	.giwp_txt	{ padding: 37px 0;  }
	.giwp_img .number01	{ position: absolute; z-index: 1; bottom:-37px; right:15px; width: 74px; }
	.giwp_img .number03	{ position: absolute; z-index: 1; bottom:-37px; right:15px; width: 74px; }
	.giwp_img .number02	{ display: none; }
	.giwp_txt > h3	{ font-size: 17px; padding: 0 0 14px; }
	.giwp_txt > h4	{ font-size: 15px; padding: 0 0 22px; }
	.giwp_txt > p	{ font-size: 12px; line-height: 20px; }
	.giwp_img.im02	{ padding-top: 10px; }
	.giwp_txt.tx02	{ border-top: 2px solid #f3f3f3; text-align: center; }
}
.genreset	{ padding: 50px 0; display: -webkit-flex; display: flex; justify-content: center; background-color: #f3f3f3; }
.btnset	{ padding: 0; margin: 0; display: -webkit-flex; display: flex; flex-wrap: wrap; justify-content: center; width: 100%; max-width: 700px; }
.btnset > li	{ width: calc(100% / 4 - 15px); padding: 0; margin: 0 20px 0 0; position: relative; }
.btnset > li:nth-child(4n)	{ margin-right: 0; }
.btnset > li > a	{ background-color: #000; display: -webkit-flex; display: flex; justify-content: center; align-items: center; padding: 0; margin: 0; text-align: center; border: 1px solid #000; height:100%; min-height:54px; transition: all .5s; position: relative; border-radius: 0; box-sizing: border-box; }
.btnset > li > a > span	{ color:#fff; font-size: 16px; font-weight: 700; line-height: 1; letter-spacing:.05rem; }
.arrow_right::before	{ content: ""; margin: auto; position: absolute; top: 0; bottom: 0; right: 10px; width: 8px; height: 8px; border-top: 2px solid #fff; border-right: 2px solid #fff; transform: rotate(45deg); }
@media screen and (min-width: 768px) {
	.btnset > li > a:hover	{ background-color: transparent; }
	.btnset > li > a:hover > span	{ color:#000; }
}
@media screen and (max-width: 767px) {
	.genreset	{ padding: 37px 0 22px; }
	.btnset	{ justify-content: space-between; max-width: 260px; }
	.btnset > li	{ width: calc(100% / 2 - 7.5px); margin: 0 0 15px; }
	.btnset > li > a	{ min-height:40px; }
	.btnset > li > a > span	{ font-size: 12px; }
}
@media screen and (max-width: 374px) {
	.btnset > li > a > span	{ font-size: 10px; }
}

/* ------------ COUPON CODE ------------- */
.couponcode	{ display: -webkit-flex; display: flex; justify-content: center; align-items: center; padding: 0 0 40px; margin: 0; }
.couponcode > p	{ padding: 15px 40px; background-color: #000; display: -webkit-flex; display: flex; justify-content: center; align-items: center; }
.couponcode > p > span	{ color:#fff; font-size: 16px; line-height: 1; font-weight: 400; padding: 2px 10px 0 0; }
.couponcode > p > b	{ color:#fff; font-size: 22px; line-height: 1; font-weight: 700; }
@media screen and (max-width: 767px) {
	.couponcode > p	{ padding: 10px 20px 12px; }
	.couponcode > p > span	{ font-size: 14px; padding: 2px 5px 0 0; }
	.couponcode > p > b	{ font-size: 20px; }
}

/* ------------ INFO ------------- */
.coopn-info	{ padding: 0 20px 80px 80px; margin: 0 auto; max-width: 1000px; }
.coopn-info dl	{ display: -webkit-flex; display: flex; flex-wrap: wrap; align-items: flex-start; margin: 0 auto; max-width: 560px; }
.coopn-info dl dt	{ width: 7em; font-size: 18px; line-height: 1.6; font-weight: 700; letter-spacing:.1rem; }
.coopn-info dl dd	{ width: calc(100% - 7em); font-size: 18px; line-height: 1.6; font-weight: 700; padding: 0 0 5px; }
.coopn-info dl dd span	{ display: block; font-size: 13px; line-height: 1.6; font-weight: 400; padding: 0 0 5px; }
@media screen and (min-width: 768px) {
	.coopn-info dl dd span br	{ display: none; }
}
@media screen and (max-width: 767px) {
	.coopn-info	{ padding: 0 20px 20px; }
	.coopn-info dl dt	{ width: 100%; text-align: center; font-size: 16px; }
	.coopn-info dl dd	{ width: 100%; text-align: center; font-size: 16px; padding: 0 0 15px; }
	.coopn-info dl dd span	{ font-size: 12px; }
}

.dhithi-info	{ padding: 0 20px 40px; margin: 0 auto; max-width: 1000px; display: -webkit-flex; display: flex; justify-content: space-between; }
.dhithi-set	{ width: calc(50% - 10px); }
.dhithi-set > b	{ font-size: 16px; line-height: 1.6; font-weight: 700; letter-spacing:.1rem; }
.dhithi-set ol	{ padding: 10px 0 0; margin: 0 0 0 2em; }
.dhithi-set ol li	{ list-style-type: decimal; font-size: 14px; line-height: 1.6; font-weight: 400; padding: 0 0 5px; }
.dhithi-set ul	{ padding: 10px 0 0; margin: 0 0 0 2em; }
.dhithi-set ul li	{ list-style-type: disc; font-size: 14px; line-height: 1.6; font-weight: 400; padding: 0 0 5px; }
@media screen and (max-width: 767px) {
	.dhithi-info	{ padding: 0 20px 40px 10px; flex-wrap: wrap; }
	.dhithi-set	{ width: 100%; }
	.dhithi-set > b	{ font-size: 15px; }
	.dhithi-set ol,
	.dhithi-set ul	{ padding: 10px 0 5px; margin: 0 0 0 2em; }
	.dhithi-set ol li,
	.dhithi-set ul li	{ font-size: 13px; padding: 0 0 3px; }
}

/* ------------ BRANDS ------------- */
.bottomoval	{ padding: 60px 20px 40px; margin: 0 auto; text-align:center; background-color: #f3f3f3; max-width: 1000px; }
.bottomoval h2	{ margin: 0 auto 20px; display: block; text-align: center; font-size: 22px; line-height: 1; font-weight: 700; }
.itemBrandWac	{ margin:0 auto; max-width: 800px; padding: 10px; display: -webkit-flex; display: flex; flex-wrap: wrap; }
.itemBrandColumn	{ width: calc(100% / 5); padding: 0 20px 10px; }
.itemBrandColumn a	{ display: block; text-align: center; }
.itemBrandColumn a img	{ width: 100%; vertical-align:bottom; line-height: 0; margin: 0 auto; transition: all .5s; }
@media screen and (min-width: 768px) {
	.itemBrandColumn a:hover img	{ opacity: .6; }
}
@media (orientation: portrait) and (max-width: 767px)	{ 
	.bottomoval	{ padding: 40px 20px 20px; }
	.bottomoval h2	{ margin: 0 auto 10px; font-size: 18px; }
	.itemBrandColumn	{ width: calc(100% / 2); padding: 0; }
	.itemBrandColumn a img	{ width: 70%; }
}


/* ------------ BLOCK ------------- */
@media (max-width: 767px)	{ .pconly { display: none!important; } }
@media (min-width: 768px)	{ .pconly { display: inline-block; } }
@media (max-width: 767px)	{ .sponly { display: inline-block; } }
@media (min-width: 768px)	{ .sponly { display: none!important; } }
