@charset "utf-8";
.flex{display: flex;}
#wrapper .inner{padding: 0 50px; max-width: 1100px;}
#wrapper { margin: 146px auto 143px;}

.text{line-height: 1.88; letter-spacing: 0.06em; font-weight: 200;}
.happy h3.happy-h{font-size: 27px; text-align: center; letter-spacing: 0.2em;line-height: 1.52;}

.happy .title_box{padding: 60px 0 0; justify-content: space-between;align-items: flex-start;}
.happy .title_box h3{font-size: 30px; line-height: 154%; letter-spacing: 0.07em;}
.happy .title_box p{width: 701px; height: auto; font-size: 16px; line-height: 1.8; font-weight: 200; letter-spacing: 0.1em;}
.happy .img_box{position: relative;}
.happy .img_box p{letter-spacing: 0.09em; font-size: 30px; font-family: futura-pt, sans-serif; font-style: normal; font-weight: 500; line-height: 100%; position: absolute; top: 62px; left: 50px; color: #fff;}
.happy .list_box{padding: 75px 0 0;}
.happy .list_box .box{align-items: flex-start;}
.happy .list_box .box:not(:last-child){padding: 0 0 71px;}
.happy .list_box .box .main_img{width: 500px; height: auto; margin: 0 53px 0 0;}
.happy .list_box .box .main_img img{width: 100%; height: auto;}
.happy .list_box .box .tt_box{width: auto; height: auto;}
.happy .list_box .box .tt_box h4{line-height: 160%; font-size: 17px; letter-spacing: 0.07em;}
.happy .list_box .box .tt_box h4 span{letter-spacing: 0.09em; font-size: 38px; font-family: futura-pt, "Hiragino Kaku Gothic ProN", "ヒラギノ角ゴ ProN W3", Meiryo, メイリオ, Osaka, "MS PGothic", arial, helvetica, sans-serif; font-style: normal; font-weight: 700; line-height: 1.24;padding: 0px 0 10px; display: inline-block;}
.happy .list_box .box .tt_box h4 span span{font-family: "Hiragino Kaku Gothic ProN", "ヒラギノ角ゴ ProN W3", Meiryo, メイリオ, Osaka, "MS PGothic", arial, helvetica, sans-serif; font-style: normal; font-weight: 500; font-size: 35px;}

.happy .list_box .box .tt_box .btn{margin: 43px 0 0;width: 330px; height: auto;}

.modal_box { display: none; position: fixed; inset: 0; background: rgba(0, 0, 0, 0.6);	z-index: 9999;}
.modal_box .cartArea {position: absolute; max-width: 460px; margin: 40px auto; background: #fff; padding: 30px; border-radius: 20px; top: 50%; left: 50%; transform: translate(-50%,-50%); width: 100%;}
.modal_box .cartArea .typeBox .option_types label{padding: 0 0 10px;}
.modal-close {cursor: pointer; position: absolute; width: 60px; height: 60px; display: block; top: -70px; right: -70px;}
.modal-close:before{width: 100%; height: 2px; content: ""; display: block; background: #fff; position: absolute;top: 50%; left: 50%; transform: translate(-50%,-50%) rotateZ(-45deg);}
.modal-close:after{width: 100%; height: 2px; content: ""; display: block; background: #fff; position: absolute;top: 50%; left: 50%; transform: translate(-50%,-50%) rotateZ(45deg);}


body.modal-open {overflow: hidden;}
.modal_box .cartBtn button{width: 100%; height: auto;}
.modal_box .cartBtn button img{width: 100%; height: auto;}
/* ------------------------------------------------------------ #fv */
#fv .bg_fv{text-align: center; padding: 439px 0 73px; background: url( https://d2w53g1q050m78.cloudfront.net/andmedicalcom/uploads/assets/images/happy/fv_1.jpg ) no-repeat center center; background-size: cover;}
#fv h2{text-align: center; font-size: 19px; color: #fff; letter-spacing: 0.2em;line-height: 160%;}
#fv h2 span{font-family: futura-pt, sans-serif; font-style: normal; font-weight: 700; font-size: 52px; letter-spacing: 0.09em; padding: 0 0 12px;display: inline-block;}
#fv .mini_text{text-align: center; font-size: 14px; line-height: 160%; letter-spacing: 0.069em; padding: 44px 0 0;}
#fv h3.happy-h{text-align: center; font-size: 34px; letter-spacing: 0.064em; padding: 57px 0 0; line-height: 120.6%;}
#fv .text{padding: 100px 0 0; }

/* ------------------------------------------------------------ #move */
#move{padding: 150px 0 0;}
#move .move_bg{text-align: center; padding: 209px 0; background: url( https://d2w53g1q050m78.cloudfront.net/andmedicalcom/uploads/assets/images/happy/bg_2.jpg ) no-repeat center center; background-size: cover;}
#move .move_bg h3{font-family: futura-pt, sans-serif; font-style: normal; font-weight: 700; font-size: 66px; letter-spacing: 0.069em; color: #fff;}
#move .text{padding: 95px 0 0;}

/* ------------------------------------------------------------ #move */
#care{padding: 173px 0 0 ;}
#care .care_bg{text-align: center; padding: 209px 0; background: url( https://d2w53g1q050m78.cloudfront.net/andmedicalcom/uploads/assets/images/happy/bg_3.jpg ) no-repeat center center; background-size: cover}
#care .care_bg h3{font-family: futura-pt, sans-serif; font-style: normal; font-weight: 700; font-size: 66px; letter-spacing: 0.069em; color: #fff;}
#care .text_1{padding: 95px 0 0;}
#care .content_box_1{padding: 196px 0 0;}
#care .content_box_1 .text{padding: 98px 0 0;}
#care .content_box_1 h4{text-align: center; font-size: 34px; line-height: 120.6%; letter-spacing: 0.069em;}
#care .content_box_1 img{width: 100%; height: auto; padding: 76px 0 0;}
#care .content_box_1 img.img_5{padding: 76px 0 0;}
#care .content_box_2{padding: 84px 0 0;}
#care .content_box_2 .text{line-height: 180%; letter-spacing: 0.06em;}
#care .content_box_2 img.img_6{padding: 116px 0 0;}

/* ------------------------------------------------------------ .insta */

.insta .ecbn-selection-wrapper{text-align: center;}
.insta .ecbn-selection-widget{padding: 0 50px;}
.insta .ecbn-selection-wrapper .ecbn-selection-title{padding: 0 0 0 58px; display: inline-block; width: auto; position: relative;margin: 120px 0 30px;}
.insta .ecbn-selection-wrapper .ecbn-selection-title span{ letter-spacing: 0.05em; font-size: 42px; font-family: futura-pt, sans-serif; font-style: normal; font-weight: 700; line-height: 163%; position: relative; }
.insta .ecbn-selection-wrapper .ecbn-selection-title:before{content: ""; display: inline-block; width: 42px; height: 42px; position: absolute; left: 0px; top: 50%; transform: translateY(-50%); background: url( https://d2w53g1q050m78.cloudfront.net/andmedicalcom/uploads/assets/images/happy/instr_1.svg ) no-repeat center center; background-size: 100%;}

.ecbn-selection-preview-new div.noProductsMsg,
.ecbn-selection-preview-content .ecbn-selection-preview-slide-wrapper .ecbn-selection-slider-controls,
.insta .ecbn-selection-wrapper .ecbn-selection-description,
.insta .ecbn-selection-wrapper .ecbn-selection-title img,

.insta .ecbn-selection-wrapper .ecbn-selection-footer2{display: none !important; }

.ecbn-selection-preview-slide-wrapper .ecbn-selection-right-item-list{text-align: left !important;}
.ecbn-selection-preview .ecbn-selection-right div.ecbn-selection-right-item-list .ecbn-selection-item{width: calc(100% / 2 - 10px); height: auto; padding: 0; margin: 0;}
.ecbn-selection-preview .ecbn-selection-right div.ecbn-selection-right-item-list .ecbn-selection-item-img img{width: 100%; height: auto;}
.ecbn-selection-preview .ecbn-selection-right div.ecbn-selection-right-item-list .ecbn-selection-item-productprice,
.ecbn-selection-preview .ecbn-selection-right div.ecbn-selection-right-item-list .ecbn-selection-item-name,
.ecbn-selection-preview .ecbn-selection-right div.ecbn-selection-right-item-list .ecbn-selection-item-productprice .ecbn-selection-item-normalprice{text-align: left !important; width: 100% !important;}
.insta .vsm-slider .ecbn-selection-wrapper li.ecbn-selection-item > div > a{height: 211px; width: 211px;}


.ecbn-selection-preview-slide-wrapper .ecbn-selection-right-item-list{width: 100% !important; transform: none !important; display: flex !important; flex-wrap: wrap; gap: 20px 20px; height: auto !important;}

.ecbn-selection-preview .ecbn-selection-preview-personal {margin: 10px auto 0px; width: 496px;}
.ecbn-selection-preview .ecbn-selection-preview-personal > span{margin: 0 5px 0 0;}
.ecbn-selection-preview .ecbn-selection-preview-personal .ecbn-selection-preview-media--icon a::before{ width: 24px; height: 24px; background: url( https://d2w53g1q050m78.cloudfront.net/andmedicalcom/uploads/assets/images/happy/instr_1.svg ) no-repeat center center !important; background-size: 100% !important;}
/* ------------------------------------------------------------ mobile ------------------------------------------------------------ */
@media only screen and (max-width: 1024px) {
	#wrapper .inner{padding: 0 50px; max-width: 990px;}
	.happy .img_box p{font-size: 30px; top: 30px; left: 25px; }
	.happy .title_box h3{font-size: 25px;}
	.happy .title_box p{width: calc(100% - 280px); }
	.happy .list_box .box .main_img{width: 45%; height: auto; margin: 0 5% 0 0;}
	.happy .list_box .box .main_img .PC{display: block;}
	.happy .list_box .box .main_img .SP{display: none;}
	/* ------------------------------------------------------------ .happy_1 */
	.happy_1 .img_box img{width: 50%; height: auto;}
	.happy_1 p.text{width: 100%;}
	
	/* ------------------------------------------------------------ .happy_2 */
	.happy_2 .text_box{width: 100%;}
	.happy_2 .text_box .box {width: 46%;}
	
	

}
@media only screen and (max-width: 768px) {
	.flex{display: block;}
	#wrapper .inner{padding: 0; max-width: 90%; margin: 0 auto;}
	#wrapper .inner_sp{width: 90%; margin: 0 auto;}
	#wrapper { margin: 67px auto 143px;min-width: 100%;}
	.happy h3.happy-h{font-size: 20px; line-height: 165%;}
	
	.happy .img_box p{font-size: 16px; top: 17px; left: 17px; }
	.happy .title_box{padding: 50px 0 0; }
	.happy .title_box h3{font-size: 18px; text-align: center; }
	.happy .title_box p{width: 100%; font-size: 14px; padding: 15px 0 0;}
	.happy .list_box{padding: 47px 0 0;}
	.happy .list_box .box{justify-content: space-between; align-items: flex-start;}
	.happy .list_box .box img{width: 100%; height: auto;}
	.happy .list_box .box:not(:last-child){padding: 0px 0 35px;}
	.happy .list_box .box .main_img .PC{display: none;}
	.happy .list_box .box .main_img .SP{display: block;}
	.happy .list_box .box .tt_box{width: 100%; height: auto;padding: 20px 0 0;}
	.happy .list_box .box .tt_box h4{font-size: 13px;}
	.happy .list_box .box .tt_box h4 span{font-size: 30px; padding: 0px 0 10px; }
	.happy .list_box .box .tt_box h4 span span {font-size: 28px;}
	.happy .list_box .box .tt_box .btn{margin: 25px 0 0;width: 100%; height: auto;}
	.happy .list_box .box .tt_box .btn img{width: 100%; height: auto;}
	
	.modal_box .cartArea {max-width: 90%; margin: 20px auto; padding: 20px; border-radius: 20px; width: 100%;}
	.modal-close {cursor: pointer; position: absolute; width: 40px; height: 40px; display: block; top: -60px; right: -0px;}
	.modal-close:before{height: 2px;}
	.modal-close:after{height: 2px;}
	
	.text {font-size: 14px;}
	
	.happy .list_box .box .main_img{width: 100%; height: auto; margin: 0;}
	/* ------------------------------------------------------------ #fv */
	#fv h2{font-size: 13px; }
	#fv h2 span{font-size: 37px; }
	
	/* ------------------------------------------------------------ #fv */
	#fv .bg_fv{padding: 65% 0; background: url( https://d2w53g1q050m78.cloudfront.net/andmedicalcom/uploads/assets/images/happy/fv_1_sp.jpg ) no-repeat center center; background-size: cover;}
	#fv h2{font-size: 19px;}
	#fv h2 span{font-size: 30px; padding: 0 0 12px;}
	#fv .mini_text{font-size: 11px; padding: 20px 0 0;}
	#fv h3.happy-h{font-size: 26px; padding: 25px 0 0; line-height: 140%;}
	#fv .text{padding: 50px 0 0; }
	
	/* ------------------------------------------------------------ #move */
	#move{padding: 70px 0 0;}
	#move .move_bg{padding: 56% 0; background: url( https://d2w53g1q050m78.cloudfront.net/andmedicalcom/uploads/assets/images/happy/bg_2_sp.jpg ) no-repeat center center; background-size: cover;}
	#move .move_bg h3{font-size: 40px;}
	#move .text{padding: 50px 0 0;}
	
	/* ------------------------------------------------------------ #move */
	#care{padding: 80px 0 0 ;}
	#care .care_bg{ padding: 56% 0; background: url( https://d2w53g1q050m78.cloudfront.net/andmedicalcom/uploads/assets/images/happy/bg_3_sp.jpg ) no-repeat center center; background-size: cover}
	#care .care_bg h3{font-size: 40px; }
	#care .text_1{padding: 48px 0 0;}
	#care .content_box_1{padding: 100px 0 0;}
	#care .content_box_1 .text{padding: 50px 0 0;}
	#care .content_box_1 h4{font-size: 22px;}
	#care .content_box_1 img{padding: 38px 0 0;}
	#care .content_box_1 img.img_5{padding: 38px 0 0;}
	#care .content_box_2{padding: 42px 0 0;}
	#care .content_box_2 img.img_6{padding: 55px 0 0;}
	
	/* ------------------------------------------------------------ .insta */
	.insta .ecbn-selection-widget-new div.ecbn-selection-wrapper{margin: 0 auto; }
	.insta .ecbn-selection-widget-new .ecbn-selection-wrapper{margin: 0 auto !important; width: 90%;}
	.insta .ecbn-selection-widget{padding: 0px;}
	.insta .ecbn-selection-wrapper .ecbn-selection-title{padding: 0 0 0 34px; margin: 70px 0 20px;}
	.insta .ecbn-selection-wrapper .ecbn-selection-title span{ font-size: 28px; }
	.insta .ecbn-selection-wrapper .ecbn-selection-title:before{width: 28px; height: 28px;}
	.insta .vsm-slider .ecbn-selection-wrapper li.ecbn-selection-item > div > a{height: auto; width: 100%;}
	.insta .ecbn-selection-wrapper li.ecbn-selection-item {width: calc(33.33333vw - 13px); }
	.ecbn-selection-preview .ecbn-selection-right div.ecbn-selection-right-item-list .ecbn-selection-item-content,
	.ecbn-selection-preview .ecbn-selection-right div.ecbn-selection-right-item-list .ecbn-selection-item-img{width: 100% !important; height: auto;}
	.ecbn-selection-preview .ecbn-selection-right div.ecbn-selection-right-item-list .ecbn-selection-item{width: calc(100% / 2 - 7px); }

	.ecbn-selection-preview .ecbn-selection-preview-personal {margin: 10px auto 0px; width: 90%;}
	.ecbn-selection-preview-slide-wrapper .ecbn-selection-right-item-list{width: 100% !important; gap: 14px; height: auto !important; }
}