@charset "UTF-8";
html { font-size: 62.5%; }

body { width: 100%; height: auto; overflow-x: hidden; margin: 0; padding: 0; font-family: "游ゴシック体", "Yu Gothic", YuGothic, "ヒラギノ角ゴシック Pro", "Hiragino Kaku Gothic Pro", 'メイリオ' , Meiryo , Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;}

.contWrap { max-width: 750px; height: auto; margin: 0 auto; overflow-x: hidden; position: relative; }
.contWrap * { -webkit-box-sizing: border-box; box-sizing: border-box; line-height: 0; -ms-flex-line-pack: start; align-content: flex-start; -webkit-box-align: start; -ms-flex-align: start; align-items: flex-start; box-sizing: border-box; tap-highlight-color: rgba(0, 0, 0, 0); -webkit-tap-highlight-color: rgba(0, 0, 0, 0); }
.contWrap img { width: 100%; height: auto; }
.contWrap img.honeymark { width: 26.6666667%; margin-top: 10.6666667%; margin-bottom: 8%; }

.move { -webkit-transition: 1s; transition: 1s; -webkit-transform: translateY(20px); transform: translateY(20px); opacity: 0; }
.move.active { -webkit-transform: translateY(0vw); transform: translateY(0vw); opacity: 1; }

.hero { width: 100%; height: 92%; padding-top: 92%; display: block; background: url(../images/index_manukahoney/hero.png); background-repeat: no-repeat; background-size: 100% auto; position: relative; }
.hero .logo { width: 22%; height: auto; position: absolute; left: 8%; top: 8%; }
.hero h2 { position: absolute; top: 39%; left: 8%; width: 48%; height: auto; }

.cont1 { padding-top: 24%; background-image: url(../images/index_manukahoney/mapicon.png); background-size: 22.666% auto; background-repeat: no-repeat; background-position: center 2vw; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -ms-flex-wrap: wrap; flex-wrap: wrap; -ms-flex-line-pack: start; align-content: flex-start; -webkit-box-align: start; -ms-flex-align: start; align-items: flex-start; }
.cont1 h3 { width: 83%; }
.cont1 img.justimg { margin-top: 9.3%; margin-bottom: 12%; width: 72%; }
.cont1 a { width: 100%; height: auto; margin: 0; padding: 0; }

#fixBtn { width: 100%; max-width: 750px; height: auto; position: fixed; top: auto; right: 0; left: 0; bottom: 0; margin: 0 auto; opacity: 0; -webkit-transition: .4s; transition: .4s; }
#fixBtn.fixed { opacity: 1; z-index: 50000; }

#pholder { width: 100%; height: 0; opacity: 0; -webkit-transition: 0; transition: 0; }
#pholder.active { height: auto; opacity: 1; }

.cont1, .cont2, .cont4, .cont6, .cont5, .cont3, .cont4, .cont6, .cont5, .cont6, .cont7, .cont8, .cont9, .about { font-size: 62.5%; }
@media screen and (max-width: 414px) { .cont1, .cont2, .cont4, .cont6, .cont5, .cont3, .cont4, .cont6, .cont5, .cont6, .cont7, .cont8, .cont9, .about { font-size: 38%; } }
@media screen and (max-width: 320px) { .cont1, .cont2, .cont4, .cont6, .cont5, .cont3, .cont4, .cont6, .cont5, .cont6, .cont7, .cont8, .cont9, .about { font-size: 30%; } }

.cont2, .cont4, .cont6, .cont5 { width: 100%; display: block; background: url(../images/index_manukahoney/cont2_bg.png); background-repeat: no-repeat; background-size: cover; padding-top: 12.8%; padding-bottom: 12.8%; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -ms-flex-wrap: wrap; flex-wrap: wrap; }
.cont2 h4, .cont4 h4, .cont6 h4, .cont5 h4 { width: 76%; margin-bottom: 12%; }
.cont2 ul, .cont4 ul, .cont6 ul, .cont5 ul { width: 100%; padding-top: 92%; position: relative; }
.cont2 ul li, .cont4 ul li, .cont6 ul li, .cont5 ul li { width: 54%; height: auto; position: absolute; }
.cont2 ul li:nth-of-type(1), .cont4 ul li:nth-of-type(1), .cont6 ul li:nth-of-type(1), .cont5 ul li:nth-of-type(1) { left: 0; top: 0; }
.cont2 ul li:nth-of-type(2), .cont4 ul li:nth-of-type(2), .cont6 ul li:nth-of-type(2), .cont5 ul li:nth-of-type(2) { right: 0; top: 0; }
.cont2 ul li:nth-of-type(3), .cont4 ul li:nth-of-type(3), .cont6 ul li:nth-of-type(3), .cont5 ul li:nth-of-type(3) { left: 0; bottom: 0; }
.cont2 ul li:nth-of-type(4), .cont4 ul li:nth-of-type(4), .cont6 ul li:nth-of-type(4), .cont5 ul li:nth-of-type(4) { right: 0; bottom: 0; }

.cont3 { width: 100%; height: auto; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -ms-flex-wrap: wrap; flex-wrap: wrap; padding: 0%; }
.cont3 h4 { width: 77.3333333%; }
.cont3 .circles { width: 80%; margin: 12% 0; }
.cont3 p { font-size: 1.68em; font-size: 2.7em; line-height: 180%; width: 82.666666667%; }
.cont3 p strong { color: #bc9d4d; font-weight: bold; }
.cont3 span { font-size: 2em; line-height: normal; display: block; text-align: left; width: 82.666666667%; margin-top: 10px; }
.cont3 .popup-link { width: 82.666666667%; margin-top: 12%; }

.cont4, .cont6 { height: auto; margin-top: 22%; background-position: center 20%; padding-bottom: 0; background-image: url(../images/index_manukahoney/cont4_bg.png); }
.cont4 img.honeymark, .cont6 img.honeymark { margin-top: -23.966667%; }
.cont4 h4, .cont6 h4 { width: 84%; margin-bottom: 6%; }
.cont4 p, .cont6 p { font-size: 2.6em; line-height: 180%; padding: 0 8%; color: white; }
.cont4 .box, .cont6 .box { width: 84%; margin: 8% 0; }

.cont5 { background: white; padding: 0% 0% 0; height: auto; }
.cont5 h4 { width: 100%; margin-bottom: 6%; }
.cont5 .inwrap { width: 84%; }
.cont5 p { font-size: 2.6em; line-height: 180%; color: black; }
.cont5 p.main { font-weight: bold; }
.cont5 span { font-size: 3.2em; width: 100%; font-weight: bold; color: #cfaf5f; height: 12vw; text-align: center; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center; line-height: 0; border: 1px solid #cfaf5f; border-right: 0; border-left: 0; margin: 6% 0; }
.cont5 .box { margin: 6% 0; }

.cont6 { background-image: url(../images/index_manukahoney/cont6_bg.png); background-size: 100% auto; background-position: left top; background-color: white; margin-top: 20%; padding-top: 0; }
.cont6 h4 { width: 54.933333333%; margin: 0 20%; margin-bottom: 6%; }
.cont6 h4:nth-of-type(2) { width: 82.666666667%; margin: 0; }
.cont6 img.honeymark { margin-top: -11.5%; }
.cont6 p { font-size: 2.6em; }
.cont6 p.main { font-weight: bold; }
.cont6 p.attention { color: black; margin-bottom: 6%; }
.cont6 .backp { width: 84%; padding-right: 7%; background: white; }
.cont6 .backp p { padding: 7% 0% 0% 7%; width: 100%; color: black; }
.cont6 .backp img { margin-top: 6%; }
.cont6 .box.nm:nth-of-type(2), .cont6 .box.nm:nth-of-type(4) { margin-bottom: 0; }
.cont6 .box.nm:nth-of-type(3) { margin-top: 0; }
.cont6 .warning { width: 73.333333333%; margin: 10% 0 6% 0; }
.cont6 .license { font-size: 2.6em; color: black; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: start; -ms-flex-pack: start; justify-content: flex-start; -webkit-box-align: center; -ms-flex-align: center; align-items: center; width: 100%; padding: 0 8%; margin-bottom: 12%; }
.cont6 .license img { width: 4.266666667%; margin-right: 5px; }
.cont6 .license span { text-decoration: underline; }

.cont7 { width: 100%; height: auto; padding: 12% 0% 8%; background: #f9f6f1; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -ms-flex-wrap: wrap; flex-wrap: wrap; }
.cont7 h4 { width: 40%; margin-bottom: 8%; }
.cont7 p { line-height: 180%; font-size: 2.7em; color: black; }
.cont7 p.smallp { font-size: 2.2em; }
.cont7 ul { margin-bottom: 4%; padding: 0 8%; }
.cont7 .smallp { padding: 0 8%; }
.cont7 li { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: start; -ms-flex-pack: start; justify-content: flex-start; -webkit-box-align: center; -ms-flex-align: center; align-items: center; padding: 4% 0; border-bottom: 1px solid #dbd7cc; }

.cont8 { width: 100%; height: auto; padding: 12% 0% 0; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -ms-flex-wrap: wrap; flex-wrap: wrap; }
.cont8 .license { color: black; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: start; -ms-flex-pack: start; justify-content: flex-start; -webkit-box-align: center; -ms-flex-align: center; align-items: center; width: 100%; padding: 0%; margin: 10px 0; }
.cont8 .license img { width: 4.266666667%; margin-right: 5px; }
.cont8 .license span { text-decoration: underline; }
.cont8 h4 { width: 41.7333333333%; margin-bottom: 8%; }
.cont8 dl { width: 100%; height: auto; padding: 0 8% 4%; border-bottom: 1px solid #cfaf5f; }
.cont8 dl:nth-of-type(n+2) { margin-top: 8%; }
.cont8 dl dt { width: 100%; height: auto; color: #cfaf5f; font-size: 2.8em; font-weight: bold; line-height: 180%; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; -webkit-box-align: start; -ms-flex-align: start; align-items: flex-start; margin-bottom: 4.266666667%; position: relative; padding-left: 8.533333333%; }
.cont8 dl dt p { line-height: 140%; }
.cont8 dl dt p:before { content: ""; background-image: url(../images/index_manukahoney/q.png); width: 4.8%; height: 4.8%; padding-top: 4.8%; display: inline-block; background-size: contain; background-repeat: no-repeat; position: absolute; left: 0; top: 2%; }
.cont8 dl dt span.toddle { width: 5.733333333%; height: auto; padding-top: 1.3%; -webkit-transition: .2s; transition: .2s; cursor: pointer; margin-top: 1%; -webkit-transform: rotate(0deg); transform: rotate(0deg); }
.cont8 dl dt span.toddle.active { -webkit-transform: rotate(180deg); transform: rotate(180deg); }
.cont8 dl dd { width: 100%; max-height: 0; font-size: 2.8em; line-height: 180%; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: start; -ms-flex-pack: start; justify-content: flex-start; -webkit-box-align: start; -ms-flex-align: start; align-items: flex-start; -webkit-transform-origin: top; transform-origin: top; -webkit-transition: .6s; transition: .6s; overflow: hidden; -webkit-transition: all 600ms cubic-bezier(0.095, 0.15, 0.56, -0.035); transition: all 600ms cubic-bezier(0.095, 0.15, 0.56, -0.035); -webkit-transition-timing-function: cubic-bezier(0.07, 0.3, 0.03, 0.98); transition-timing-function: cubic-bezier(0.07, 0.3, 0.03, 0.98); }
.cont8 dl dd.active { max-height: 400px; }
.cont8 dl dd p { width: calc(100% - 8.5%); width: calc(100% - 10%); line-height: 180%; }
.cont8 dl dd:before { content: ""; background-image: url(../images/index_manukahoney/a.png); width: 4.866666667%; padding-top: 4.866667%; margin-right: 5.533333333%; margin-top: 1.8%; display: block; background-size: auto 100%; background-repeat: no-repeat; }

.cont9 { padding: 20% 8% 12% 8%; }
.cont9 ul { width: 100%; height: auto; }
.cont9 ul li { width: 100%; padding-bottom: 11%; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: end; -ms-flex-pack: end; justify-content: flex-end; -ms-flex-wrap: wrap; flex-wrap: wrap; padding-top: 12.333333333%; margin-bottom: 9.333333333%; }
.cont9 ul li h5 { font-size: 2.5em; display: block; width: 100%; text-align: right; height: 1.8em; margin-bottom: 4.266666667%; }
.cont9 ul li .item-name { font-size: 3.5em; font-weight: bold; text-align: right; display: block; height: 3.733333333%; width: 100%; margin-bottom: 10%; }
.cont9 ul li div { width: 100%; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: end; -ms-flex-pack: end; justify-content: flex-end; margin-bottom: 7.866666667%; }
.cont9 ul li .net { font-size: 2.6em; font-weight: bold; margin-right: 2%; }
.cont9 ul li .price { font-size: 4em; font-weight: bold; }
.cont9 ul li a { width: 42%; height: auto; }
.cont9 ul li:nth-of-type(1) { background: url(../images/index_manukahoney/250.png); background-size: 38.133333333% auto; background-position: left top; background-repeat: no-repeat; }
.cont9 ul li:nth-of-type(2) { background: url(../images/index_manukahoney/115.png); background-size: 32.533333333% auto; background-position: left top; background-repeat: no-repeat; }
.cont9 ul li:nth-of-type(3) { background: url(../images/index_manukahoney/umf10_250.png); background-size: 38.133333333% auto; background-position: left top; background-repeat: no-repeat; }
.cont9 ul li:nth-of-type(4) { background: url(../images/index_manukahoney/umf15_250.png); background-size: 38.266666667% auto; background-position: left top; background-repeat: no-repeat; }

.about { width: 100%; height: auto; padding: 12% 0% 6%; background: #f9f6f1; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -ms-flex-wrap: wrap; flex-wrap: wrap; }
.about h4 { width: 70.666666667%; margin-bottom: 8%; }
.about .inner { padding: 0 8%; }
.about p { font-size: 2.6em; line-height: 180%; color: black; }
.about .box { margin: 8% 0; }
.about ul li { line-height: normal; font-size: 2.6em; position: relative; padding-left: calc(3.466666667% + 1%); }
.about ul li:before { content: "■"; position: absolute; left: 0; top: 0; }
