@charset "utf-8";
/* CSS Document */

#pageContents.smfb{width:950px!important; background:#e4f4fc; color:#4a83c3;}
#pageContents.smfb a{text-decoration:none; background: none; padding: 0; margin: 0;}
#pageContents.smfb a:hover{color:#333;}
#pageContents.smfb h2{font-family: 'Trebuchet MS',sans-serif; text-align: center; color:#4a83c3; font-weight: 600; font-size: 34px; line-height: 1.7em}

#pageContents .spOnly{display: none;}

/*全体*/
ul.itemCnt{background-color: transparent;}
ul.itemCnt li{background-color: transparent;}
ul.itemCnt li div.itemInfo{text-align: center;}
ul.itemCnt li p.itemName{color: #402c28; font-size: 13px; font-weight: 400;}

/*main*/
div#smfbmain{width: 760px; margin: 0 auto 20px;}
div#smfbmain p{display: block; width: 95%; margin: 40px auto; z-index: 12;}
div#smfbmain div.mainbox h1{color:#4a83c3; font-weight: 600; font-size: 42px; position: absolute; top: 40px; left: 20px; z-index: 6; line-height: 1.4em;}
div#smfbmain h1 small{font-size: 36px;}
div.mainbox{width: 100%; position: relative;}
div.mainbox img.waku1{width: 100%; position: absolute; top: 0; z-index: 5;}
div.mainbox img.waku2{width: 100%; position: absolute; bottom: -40px; z-index: 5;}
div.mainbox img.circle1{width: 140px; position: absolute; left: 0; top: 260px; z-index: 10;}
div.mainbox img.circle2{width: 20%; position: absolute; right: 0; bottom: 20px; z-index: 10;}
div#smfbmain div.mainbox ul{width: 100%; padding-top: 86px;}
div#smfbmain div.mainbox ul img{width: 100%;}
div#smfbmain p.minititle{font-weight: 600; text-align: right; line-height: 1.4em; font-size: 12px; display: block; width: 92%; margin: 0; padding: 0;position: relative; z-index: 5;}

/*News*/
div.newsbox{background-color: #FFFFFF; position: relative; margin: 200px 0 100px; padding: 5%;}
#pageContents.smfb div.newsbox h2{margin-bottom: 10px; position: relative; z-index: 2;}
div.newsbox img.waku1{position: absolute; top: -90px; left: 0;}
div.newsbox img.waku2{position: absolute; bottom: -80px; left: 0;}
div.newsbox dl{width: 600px; display: flex; justify-content: space-around; flex-wrap: wrap; margin: 0 auto; position: relative; z-index: 2;}
div.newsbox dt{display: block; position: relative; z-index: 2;}
div.newsbox dd{display: block; position: relative; z-index: 2;}
div.newsbox div.underline{width: 100%; height: 1px; background-color: #4a83c3; margin-top: 10px; position: relative; z-index: 2;}

/*lineup*/
div.lineup{width: 760px; margin: 0 auto; padding-top: 80px;}
#pageContents.smfb div.lineup h2{margin-bottom: 30px;}
div.lineup ul{width: 100%; margin: 0 auto; display: flex; justify-content: center; flex-wrap: wrap;}
#pageContents.smfb div.lineup ul a{width: 30%; margin: 10px;}
div.lineup ul li{display: block; width: 100%; padding: 2%;}
div.lineup ul li h3{color: #FFFFFF; font-weight: 600; font-size: 20px; text-align: center; margin-bottom: 10px;}
div.lineup ul li h3 small{font-size: 14px;}
div.lineup ul li img{width: 100%;}
div.lineup ul li.lineupdry{background-color: #6db0d3;}
div.lineup ul li.lineupstrong{background-color: #4a83c3;}
div.lineup ul li.lineupbreath{background-color: #58a698;}
div.lineup ul li.lineupcloud{background-color: #cab5ad;}
div.lineup ul li.lineupgauze{background-color: #bdb589;}

/*compare*/
div.compare{margin: 100px auto;}
div.table{overflow: auto; max-height: 560px; margin-top: 30px;}
div.compare table{display: block; width: 800px; background-color: #ffffff; margin: 0 auto; border-collapse: collapse;}

div.compare table th{height: 80px; font-weight: 600; font-size: 14px; color: #333333; border: solid 1px #333333; background-color: #F1F1F1; text-align: center; white-space:nowrap; position: sticky; top: 0;}
div.compare table tr{height: 100px;}
div.compare table th.transparent{background-color: transparent;}
div.compare table td{border: solid 1px #333333; font-weight: 500; color: #333333; text-align: center; line-height: 1.2em; vertical-align: middle;}
div.compare table td img{width: 180px;}

/*共通*/
div.iconbox{width: 100%; height: 30px; display: flex; justify-content: center; margin: 20px 0 50px;position: relative; z-index: 2;}
div.iconbox img{width: auto; height: 40px; margin: 0 10px; display: inline-block;}
p.text{position: relative; z-index: 5; display: block; width: 750px; margin: 20px auto 50px; line-height: 1.7em;}
div.ttlimg{width: 760px; margin: 0 auto;}
div.ttlimg img{width: 100%;}
div.recommend ul{padding: 0 20px 20px;}
div.recommend ul li{display: flex; flex-wrap: nowrap; justify-content: center; width: 100%; padding: 10px 0; position: relative;}
div.recommend ul li::after{content: ''; display: inline-block; width: 80%; height: 1px; background-color: #868686; position: absolute; bottom: 4px;}
div.recommend ul li p{display: block; width: 70%; margin: 0; font-weight: 500; font-size: 15px;}
div.recommend ul li img.check{width: 20px; height: 20px; margin: 0 10px;}
div.recommend img.fuki{width: 50px; position: absolute; right: 15%; top: -7px;}

/*point*/
div.swiper-wrapper{margin: 70px auto 50px;}
div.swiper-slide img{width: 50% ;display: block; margin: 0 auto;}
.swiper-pagination-bullet{background-color: #333333;}

/*商品一覧*/
div.allitem{margin: 60px 0;}
div.allitem h3{font-weight: 600; font-size: 26px; text-align: center; margin-top: 20px; margin-bottom: 0px; line-height: 1.5em;}
ul.items{display: flex; flex-wrap: wrap; justify-content: center;}
ul.items li{width: 40%; margin: 20px; background-color: #f1f1f1;border: 1px solid #acacac; z-index: 5;}
ul.items li a{width: 100%;}
ul.items li div.itemInfo{width: 100%;}
ul.items li h4{font-size: 20px; font-weight: 600; text-align: center; color:#333333; margin: 10px 0 0;}

ul.items li div.pricerow{display: flex;flex-wrap: wrap; justify-content: center; margin: 10px 0;}
ul.items li p.Price{color:#4a83c3; font-size: 18px; font-weight: 500; padding: 0; margin: 0;}
ul.items li p.freeship{background-color: #4a83c3; color: #ffffff; text-align: center;font-size: 12px;display: block; padding: 6px;}

ul.items li img{width: 96%; margin: 8px; display: block;}
ul.items li img.lineup{width: 96%;}
ul.items li img.pillow{width: 15%; margin: 0 auto;}
ul.items li img.buy{width: 50%; margin: 20px auto; display: block;}

/*dry*/
div#dry{background-color: #FFFFFF; position: relative; margin-top: 300px;}
div#dry img.waku1{position: absolute; top: -180px; left: 0;}
div#dry img.waku2{position: absolute; bottom: -330px; left: 0; z-index: 5;}
#pageContents.smfb div#dry h2{z-index: 10; position: relative; margin: 0 auto;}

div#dry div.recommend,div#breath div.recommend,div#gauze div.recommend{width: 50%; margin: 0 auto; background-color: #f1f1f1; border-radius: 30px; position: relative;}
div#dry div.recommend h3,div#breath div.recommend h3,div#gauze div.recommend h3{font-weight: 600; font-size: 22px; text-align: center; padding-top: 20px; margin-bottom: 10px;}

/*strong*/
div#strong{background-color: #e4f4fc; position: relative; padding: 360px 0;}

div#strong div.recommend{width: 50%; margin: 0 auto; background-color: #FFFFFF; border-radius: 30px; position: relative;}
div#strong div.recommend h3{font-weight: 600; font-size: 22px; text-align: center; padding-top: 20px; margin-bottom: 10px;}

/*breath*/
div#breath{background-color: #FFFFFF; position: relative; padding: 0 0 200px; color: #333333;}
div#breath h2,div#breath h3{color: #58a698!important; position: relative;}
div#breath img.waku1{position: absolute; top: -200px; left: 0;}
div#breath img.waku2{position: absolute; bottom: -140px; left: 0; z-index: 5;}
div#breath ul.items li img.lineup{width: 40%; margin: 0 auto;}
div#breath ul.items li img.pillow{width: 10%;}
div#breath ul.items li p.Price{color: #58a698;}
div#breath ul.items li p.freeship{background-color: #58a698;}

/*cloud*/
div#cloud{background-color: #cab5ad; position: relative; padding: 100px 0 0; color: #FFFFFF;}
div#cloud h2{color: #ffffff!important; position: relative;}
div#cloud h3{color: #9b8b85;}
div#cloud img.waku1{width: 100%; position: absolute; top: -80px; left: 0;}
div#cloud img.waku2{width: 100%; position: absolute; bottom: -140px; left: 0; z-index: 1;}

div#cloud div.recommend{width: 50%; margin: 0 auto; background-color: #FFFFFF; border-radius: 30px; position: relative;}
div#cloud div.recommend h3{font-weight: 600; font-size: 22px; text-align: center; padding-top: 20px; margin-bottom: 10px;}
div#cloud div.recommend ul li p{color: #333333;}

div#cloud ul.items li img.lineup{width: 100%; margin: 0 auto;}
div#cloud ul.items li img.pillow{width: 10%;}
div#cloud ul.items li p.Price{color: #9b8b85;}
div#cloud ul.items li p.freeship{background-color: #9b8b85;}

/*gauze*/
div#gauze{background-color: #FFFFFF; position: relative; padding: 100px 0 0; color: #333333; margin-bottom: 300px;}
div#gauze h2,div#gauze h3{color: #bdb589!important;}
div#gauze h2{padding-top: 50px;}
div#gauze img.waku1{position: absolute; top: -40px; left: 0;}
div#gauze img.waku2{position: absolute; bottom: -140px; left: 0; z-index: 5;}
div#gauze ul.items li img.lineup{width: 30%; margin: 0 auto;}
div#gauze ul.items li img.pillow{width: 10%;}
div#gauze ul.items li p.Price{color: #bdb589;}
div#gauze ul.items li p.freeship{background-color: #bdb589;}
div#gauze img.waku2{position: absolute; bottom: -270px; left: 0; z-index: 3; background-color:#e4f4fc; padding-bottom:100px;}