@charset "utf-8";
/* CSS Document */

@media print, screen and (min-width: 768px){
.forsp{display:none!important;}
.makesweets_wrap h2 img,.makesweets_wrap h3>img,.makesweetsimg{width:70%;}
}

.makesweets_wrap {max-width: 900px;text-align:justify;}
.makesweets_wrap h2,.makesweets_wrap h3,.makesweets{background:none!important;text-decoration:none;text-align:center;margin:0;padding:0;}
.makesweets_wrap h3{font-size:32px;font-weight:bold; font-family:YuMincho, "Yu Mincho", "Hiragino Mincho ProN", "serif";}
.makesweets_wrap h3::after,.makesweets::after{display:none;}
.makesweets{margin:80px auto 40px;}
.makesweets_wrap p{font-size:20px;line-height:1.7;}

#sec1,#sec2,#sec3,#sec4>div,#sec5{background:url(/special/makesweets/img/bg.jpg) repeat;padding:40px;margin-bottom:80px;background-color:rgba(255,255,255,0.3);background-blend-mode:color;border-radius:10px;}
#sec1>p,#sec2>p,#sec4>div>p{margin:40px auto;text-align:center;}
.special-anchor-links{margin-top:40px;}
.makesweets_wrap .special-anchor-links a{background-color: #fff;}
#sec1 li {display:flex;justify-content:space-between;margin:40px 0 0;background-color:rgba(255,255,255,0.7);border-radius:5px;backdrop-filter:blur(5px);}
#sec1 li:nth-child(odd),#sec2 li:nth-child(even){flex-direction:row-reverse;}
#sec1 li {border-radius: 3px; overflow: hidden;}
#sec1 li h3,#sec2 li h3{margin:0 auto 10px;}
#sec1 li:nth-child(2) h3 {font-size: 26px;}
#sec1 li div:nth-child(2){width:410px;}
#sec1 li div:nth-child(1){width:410px;display:flex;flex-direction:column;justify-content:center;align-items:center;padding-bottom:5px;}
#sec1 li div p{padding:0 20px;width:100%;}
#sec1 .special-anchor-links{justify-content: center;}

#sec2>img{border-radius:3px;}
#sec2 ul {display:flex;justify-content:space-between;flex-wrap:wrap;margin:0;}
#sec2 ul li {width: calc(50% - 10px);padding:20px;margin:20px 0 0 0;border-radius: 5px;background-color:rgba(255,255,255,0.7);backdrop-filter:blur(5px);box-sizing:border-box;}
#sec2 li div:nth-child(1){margin:0 0 20px 0;}
#sec2 li div:nth-child(1) img{border-radius: 5px;}
#sec2 li div:nth-child(2) h3{text-align:left;margin:0 0 10px;border-bottom:1px solid #ccc;font-size:38px;}
#sec2 .special-anchor-links{justify-content: center;}

#sec3>div:nth-child(2){background: url(/special/makesweets/img/sec3_img1.png);width:100%;height:350px;margin:40px 0;padding:40px;}
#sec3>div:nth-child(2) h3,#sec3>div:nth-child(2) p{width:380px;margin-left:360px;margin-bottom:20px;}
#sec3>div:nth-child(2) h3{font-size:28px;}
#sec3>h3>img{margin:40px auto;}
#sec3 ul{display:flex;flex-wrap:wrap;justify-content:space-between;}
#sec3 ul li{width:260px;display:flex;background-color:rgba(255,255,255,0.9);flex-direction:column;justify-content:start;align-items:center;margin-bottom:20px;padding:0 15px;height: 320px;border-radius:5px;}
#sec3 ul li h3{font-size:20px;width: 100%;display:flex;margin-bottom:15px;flex-direction:column;justify-content:center;align-items:center;height:50px;margin-top:22px;}
#sec3 ul>li>div:nth-child(2){width:100%;max-height:165px;}
#sec3 ul>li>div:nth-child(3){margin-top:20px;}
#sec3 ul>li>div:nth-child(3)>a{font-size:16px;text-decoration:none;text-align:center;border-radius:20px;padding:7px 40px 7px 30px;position:relative;border: 1px solid #938675;}
#sec3 ul>li>div:nth-child(3)>a::after{content:"";width:8px;height:8px;border-right:2px solid #938675;border-bottom:2px solid #938675;transform:rotate(-45deg);position:absolute;right:20px;top:50%;margin-top:-4px;}
#sec3 .special-anchor-links{justify-content: center;margin-top:20px;}

#sec4 h2{margin-bottom:40px;}
#sec4>h3{margin-bottom:40px;}
#sec4>div>div{text-align:center;background-color:#fff;padding:40px 0 40px 20px;border-radius:5px;}
#sec4>div>p:nth-child(4){margin:40px auto 0;text-align:left;font-size:medium;}

.makesweets_wrap [id^="sec5_"] + [id^="sec5_"] { margin-top: 70px;}
.makesweets_wrap [id^="sec5_"] p.text { font-size: 20px;}
.makesweets_wrap [id^="sec5_"] p.text + p.text { margin: 30px 0 0 0;}
.makesweets_wrap [id^="sec5_"] h3 { margin: 0 0 30px 0;}
.makesweets_wrap [id^="sec5_"] h3 > img { width: 630px;}
.makesweets_wrap #sec5_02 h3 > img { width: 780px;}
[id^="sec5_"] .point-box { max-width: 710px; padding: 26px; margin: 60px auto 30px; border: #464645 2px dotted; border-radius: 3px; box-sizing: border-box; position: relative;}
[id^="sec5_"] .point-box h4.title { width: 160px; padding: 0 30px; position: absolute; left: calc(50% - 80px); top: -40px; box-sizing: border-box;}
[id^="sec5_"] .point-box h4.title::before { content: ''; width: 160px; height: 2px; background: #efebea; position: absolute; left: 0; top: 10px;}
[id^="sec5_"] .point-box h4.title img { width: 100px; vertical-align: top; position: relative; z-index: 2;}
[id^="sec5_"] .point-box .check-ttl { margin: 0 0 20px 0; font-size: 26px; text-align: center; line-height: 1.4;}
[id^="sec5_"] .point-box .check-ttl span { font-size: 26px; font-weight: bold; display: inline-block; background: linear-gradient(180deg, rgba(255,255,255,0) 0%, rgba(255,255,255,0) 60%, rgba(247,153,108,1) 60%,  rgba(247,153,108,1) 100%);}
#sec5 h2 { margin: 0 0 50px 0;}
#sec5_01 ul { display: flex; justify-content: space-between;}
#sec5_01 ul li { width: calc(50% - 20px); padding: 20px 20px 5px 20px; border-radius: 10px; background: #fff; box-sizing: border-box;}
#sec5_01 ul li .title { padding: 0 0 10px 0; border-bottom: #473727 1px solid; font-size: 22px; font-weight: bold; font-family:YuMincho, "Yu Mincho", "Hiragino Mincho ProN", "serif"; text-align: center;}
#sec5_01 ul li dt { padding: 15px 0; font-size: 20px; font-weight: bold; font-family:YuMincho, "Yu Mincho", "Hiragino Mincho ProN", "serif"; text-align: center;}
#sec5_01 ul li dd { padding: 15px 0; font-size: 20px; font-weight: normal; font-family:YuMincho, "Yu Mincho", "Hiragino Mincho ProN", "serif"; text-align: center;}
#sec5_01 ul li.set05_01 dl { display: flex; justify-content: space-between; align-items: center;}
#sec5_01 ul li.set05_01 dl + dl { border-top: #473727 1px solid;}
#sec5_01 ul li.set05_01 dt { width: 50%; text-align: center;}
#sec5_01 ul li.set05_01 dd { width: 50%; text-align: center;}
#sec5_01 ul li.set05_02 dd { width: 100%; padding-top: 5px; font-size: 24px; text-align: center;}
#sec5_02 figure { margin: 0 0 30px 0;}
#sec5_02 figure img { border-radius: 10px;}
#sec5_03 figure { padding: 0 60px; margin: 50px auto 0;}
#sec5_03 figure img { border-radius: 10px;}
#sec5_04 figure { padding: 0 60px; margin: 50px auto 0;}
#sec5_04 figure img { border-radius: 10px;}
#sec5_05 ul { margin: 0 60px; display: flex; flex-wrap: wrap; justify-content: space-between;}
#sec5_05 ul li { width: calc(50% - 15px); padding: 20px; margin: 0 0 30px 0; border-radius: 10px; background: #fff; box-sizing: border-box;}
#sec5_05 ul li .title { margin: 0 0 20px 0; font-size: 24px; font-weight: bold; text-align: center;}
#sec5_05 ul li .image { margin: 0 0 15px 0; text-align: center;}
#sec5_event_item_wrap { margin-top: 40px !important;}
#sec5_event_item_wrap .block-top-event--goods { padding: 20px; border-radius: 10px; background: #fff;}
#sec5_event_item_wrap .block-goods-list-d--items > li:last-child { margin-bottom: 0;}
#sec5_event_item_wrap .block-goods-list-d--item-body { width: 770px;}
#sec5_event_item_wrap .block-goods-list-d--item-description { width: 590px;}
#sec5_event_item_wrap .block-goods-list-d--image { width: 150px;}
#sec5_event_item_wrap .block-goods-list-d--image figure { width: 150px; height: 150px;}
#sec5_event_item_wrap .block-goods-list-d--item-details-left { flex-basis: 140px;}
#sec5_event_item_wrap .block-goods-list-d--item-details-right { flex-basis: 350px;}
#sec5_07 figure { padding: 0 60px; margin: 50px auto 0;}
#sec5_07 figure img { border-radius: 10px;}
#sec5_08_color_chart { padding: 15px 30px 30px; margin: 50px 60px; border-radius: 10px; background: #fff;}
#sec5_08_color_chart h4 { margin: 0 0 15px; text-align: center; font-size: 24px; font-weight: bold;}
#sec5 .special-anchor-links { justify-content: center;}
#sec5 .special-anchor-links a { background-image: none;}

@media only screen and (max-width: 767px) {
.forpc{display:none!important;}

.makesweets_wrap .special-intro{padding:0 10px;}
.makesweets_wrap p{font-size:18px;}
.makesweets_wrap p span{font-size:small;}
.makesweets{margin:40px 15px 20px;}
#sec1,#sec2,#sec3,#sec4>div,#sec5{padding:20px 15px;margin-bottom:60px;border-radius:0;}
#sec1>p,#sec2>p{margin:20px auto;text-align:left;}
#sec1 li{display:block;margin:20px 0 0;}
#sec1 li div:nth-child(2){width:100%;padding:10px;}
#sec1 li img{border-radius:5px;}
#sec1 li div:nth-child(1){width:100%;}
#sec1 li h3,#sec2 li h3{margin:20px auto 0px;font-size:26px;}
#sec1 .special-anchor-links,#sec2 .special-anchor-links{margin-top:20px;}

#sec2 ul{display:flex;flex-wrap:wrap;justify-content:space-between;}
#sec2 ul li{display:block;padding:0; margin:10px 0 0;width: 49%;}
#sec2 li div:nth-child(1){width:100%;padding:10px 10px 8px;margin:0;}
#sec2 li div:nth-child(2){width:100%;display:flex;flex-direction:column;justify-content:center;align-items:center;}
#sec2 li div:nth-child(2) h3{text-align:center;width:100%;margin:0;border-bottom:none;font-size:24px;padding:0 10px;}
#sec2 li div:nth-child(2) p{width:100%;font-size:15px;line-height:1.6;padding:0 10px 10px;}

#sec3 h2::after{content:"";display:block;background:url(/special/makesweets/img/sec3_img1.png) no-repeat;width:100%;height:180px;background-size:inherit;margin-top:15px;background-position:15% 30%;border-radius:10px 10px 0 0;}
#sec3>div:nth-child(2){background:none;background-color:#fff;height:auto;padding:15px;margin:0;border-radius:0 0 10px 10px;}
#sec3>div:nth-child(2) h3{font-size:22px;}
#sec3>div:nth-child(2) h3,#sec3>div:nth-child(2) p{width:auto;margin:0;}
#sec3>div:nth-child(2) h3{margin-bottom:10px;}
#sec3>h3>img{margin:40px auto 20px;}
#sec3>h3{font-size:24px;margin:20px auto 0;}
#sec3 ul li{width:49%;margin:10px 0 0;padding:0 5px;height: auto;justify-content:space-evenly;}
#sec3 ul li h3{font-size:18px;width: 100%;display:flex;margin-bottom:5px;height:auto;margin-top:15px;}
#sec3 ul>li>div:nth-child(2){height:auto;}
#sec3 ul>li>div:nth-child(3){margin:10px auto;}
#sec3 ul>li>div:nth-child(3)>a{font-size:14px;padding:5px 25px 5px 15px;}
#sec3 ul>li>div:nth-child(3)>a::after{right:10px;}

#sec4 h2{margin:0 15px 20px;}
#sec4>h3{margin:0 15px 20px;}
#sec4>div>h3{font-size:24px;}
#sec4>div>p{margin:10px auto;text-align:left;}
#sec4>div>p:nth-child(4){margin:20px auto 0;font-size:small;}
#sec4>div>div{padding:10px 18%;}

.makesweets_wrap [id^="sec5_"] + [id^="sec5_"] { margin-top: 40px;}
.makesweets_wrap [id^="sec5_"] p.text { font-size: 18px;}
.makesweets_wrap [id^="sec5_"] p.text + p.text { margin: 15px 0 0 0;}
.makesweets_wrap [id^="sec5_"] h3 { margin: 0 0 15px 0;}
.makesweets_wrap [id^="sec5_"] h3 > img { width: 90%;}
.makesweets_wrap #sec5_02 h3 > img { width: 90%;}
[id^="sec5_"] .point-box { max-width: 710px; padding: 30px 16px 20px; margin: 40px auto 30px; border: #464645 2px dotted; border-radius: 3px; box-sizing: border-box; position: relative;}
[id^="sec5_"] .point-box h4.title { width: 160px; padding: 0 30px; position: absolute; left: calc(50% - 80px); top: -12px; box-sizing: border-box;margin:0;}
[id^="sec5_"] .point-box h4.title::before { content: ''; width: 160px; height: 10px; background: #efebea; position: absolute; left: 0; top: 5px;}
[id^="sec5_"] .point-box h4.title img { width: 100px; vertical-align: top; position: relative; z-index: 2;}
[id^="sec5_"] .point-box .check-ttl { margin: 0 0 15px 0; font-size: 20px; text-align: center; line-height: 1.4;}
[id^="sec5_"] .point-box .check-ttl span { font-size: 20px; font-weight: bold; display: inline-block; background: linear-gradient(180deg, rgba(255,255,255,0) 0%, rgba(255,255,255,0) 60%, rgba(247,153,108,1) 60%,  rgba(247,153,108,1) 100%);}
#sec5 h2 { margin: 0 0 20px 0;}
#sec5_01 ul { display: block;}
#sec5_01 ul li { width: 100%; padding: 10px 20px 5px 20px; margin: 10px 0 0 0; border-radius: 10px; background: #fff; box-sizing: border-box;}
#sec5_01 ul li .title { padding: 0 0 8px 0; border-bottom: #473727 1px solid; font-size: 22px; font-weight: bold; font-family:YuMincho, "Yu Mincho", "Hiragino Mincho ProN", "serif"; text-align: center;}
#sec5_01 ul li dl { width: 100%; display: flex; justify-content: space-between; align-items: center;}
#sec5_01 ul li dt { width: 50%; padding: 10px 0; font-size: 18px; font-weight: bold; font-family:YuMincho, "Yu Mincho", "Hiragino Mincho ProN", "serif"; text-align: center;}
#sec5_01 ul li dd { width: 50%!important; padding: 10px 0; font-size: 18px !important; font-weight: normal; font-family:YuMincho, "Yu Mincho", "Hiragino Mincho ProN", "serif"; text-align: center;}
#sec5_02 figure { margin: 0 0 20px 0;}
#sec5_02 figure img { border-radius: 10px;}
#sec5_03 figure { padding: 0; margin: 30px auto 0;}
#sec5_03 figure img { border-radius: 10px;}
#sec5_04 figure { padding: 0; margin: 30px auto 0;}
#sec5_04 figure img { border-radius: 10px;}
#sec5_05 ul { margin: 0; display: flex; flex-wrap: wrap; justify-content: space-between;}
#sec5_05 ul li { width: calc(50% - 5px); padding: 10px; margin: 0 0 10px 0; border-radius: 10px; background: #fff; box-sizing: border-box;}
#sec5_05 ul li .title { margin: 0 0 20px 0; font-size: 22px; font-weight: bold; text-align: center;}
#sec5_05 ul li .image { margin: 0 0 15px 0; text-align: center;}
#sec5_05 ul li .text  { font-size: 16px !important; line-height: 1.4 !important;}
#sec5_event_item_wrap { margin-top: 40px !important;}
#sec5_event_item_wrap .block-top-event--goods { padding: 10px; border-radius: 10px; background: #fff;}
#sec5_event_item_wrap .block-goods-detail-j--items { padding: 0; border: none;}
#sec5_event_item_wrap .block-goods-detail-j--items li { padding: 0;}
#sec5_event_item_wrap .block-goods-detail-j--top { padding: 15px 0;}
#sec5_event_item_wrap .block-goods-detail-j--bottom { padding: 15px 0;}
#sec5_event_item_wrap .block-goods-detail-j--cart-btn { width: 70vw;}
#sec5_07 figure { padding: 0; margin: 30px auto 0;}
#sec5_07 figure img { border-radius: 10px;}
#sec5_08_color_chart { padding: 20px; margin: 30px 0; border-radius: 10px; background: #fff;}
#sec5_08_color_chart h4 { margin: 0 0 15px; text-align: center; font-size: 20px; font-weight: bold;}

	.block-goods-detail-j .block-list-add-cart-btn { background-position: 20px center !important;}
	
}
