@charset "utf-8";
/* CSS Document */

section img {
  max-width: 100%;
}

@media screen and (min-width:768px), print{
/*----------------------------------------------------------------------

PC Style

----------------------------------------------------------------------*/

/**********************************************************/
/* メインエリア */
/**********************************************************/

main {
	margin-top:60px;
}

main h2 {
	color:#666;
	font-size:28px;
	font-weight:600;
	letter-spacing:3px;
    text-align: center;
	margin-bottom:50px;
	line-height:1.3;
}

main h2 span.sub {
	font-size:18px;
	letter-spacing:0;
}


main h3 {
	font-size: 24px;
    font-weight: bold;
    color:#20ABD9;
    text-align: center;
    margin-bottom: 5px;
}



/* 商品概要 */

#product_info {
	margin-bottom:50px;
}

#product_info .left {
	width:460px;
	float:left;
}

#product_info .left img {
	width:460px;
	display:block;
}

#product_info .right {
	width:500px;
	float:right;
}

#product_info .right p.remedy {
	font-size:15px;
	margin-bottom:20px;
	position: relative;
    padding-left:20px;
}
#product_info .right p.remedy:before {
        background: #20ABD9;
        content: "";
        height: 10px;
        width: 10px;
        left: 0;
        position: absolute;
        top: 7px;
}

#product_info .right p.explanation {
	font-size:17px;
	line-height:1.7;
	margin:40px 0 20px;
}

#product_info .right p.price {
	color:#20ABD9;
	font-size:22px;
	margin-bottom:20px;
}
#product_info .right p.price span {
	font-size:14px;
}

#product_info .right a {
	display:inline-block;
	text-align:center;
	padding:10px 15px;
	color:#FFF;
	font-size:18px;
	letter-spacing:1px;
	font-weight:600;
	margin-bottom:15px;
}
#product_info .right a:hover {
	opacity:0.7;
	transition:0.3s;
}

#product_info .right a.buy {
	width:150px;
	background:#20ABD9;
	margin-right:10px;
}

#product_info .right a.subscription {
	width:300px;
	background:#FF91A2;
}

#product_info .right p.discount {
	width:460px;
	color:#FF6C83;
	font-size:16px;
	letter-spacing:1px;
	text-align:center;
	padding:5px;
	border:solid 1px #FF91A2;
}


/**************** 商品紹介 ****************/

/* sec01 */

#eyeeco .sec01 .info {
	width:720px;
	border-left:10px solid #B4E4E4;
	border-right:10px solid #B4E4E4;
	margin:0 auto;
}

#eyeeco .sec01 .info:before,
#eyeeco .sec01 .info:after {
	content:"";
	display:block;
	height:10px;
	width:100%;
	background:-webkit-gradient(linear, left top, right bottom, from(#B4E4E4), to(#B4E4E4));
	background:-moz-linear-gradient(left, #EF7D00, #FDCE40);
	background:linear-gradient(left, #B4E4E4, #B4E4E4);
}

#eyeeco .sec01 .info .inner {
	padding:10px;
}

#eyeeco .sec01 .info .inner img.sec01_img {
	width:100%;
}

#eyeeco .sec01 .info .inner ul {
	width:720px;
	margin:0 auto;
}

#eyeeco .sec01 .info .inner ul li {
	width:330px;
	float:left;
	margin-right:20px;
}
#eyeeco .sec01 .info .inner ul li:last-child {
	margin-right:0;
}

#eyeeco .sec01 .info .inner ul li h3 {
	text-align:center;
	color:#FFF;
	font-size:18px;
	font-weight:bold;
	line-height:36px;
	background:linear-gradient(#008CBB, #00B9EF);
	margin-bottom:20px;
	margin-top:30px;
}

#eyeeco .sec01 .info .inner ul li p {
	margin-bottom:10px;
}




/* sec02 */

#eyeeco .sec02 ul {
	width:720px;
	margin:0 auto;
}

#eyeeco .sec02 ul li {
	width:348px;
	float:left;
	margin-right:20px;
	margin-bottom:20px;
}
#eyeeco .sec02 ul li:nth-child(2n) {
	margin-right:0;
}
#eyeeco .sec02 ul li:nth-child(2n+1) {
	clear:both;
}

#eyeeco .sec02 ul li dl {
	height:360px;
	border:solid 1px #B4E4E4;
}

#eyeeco .sec02 ul li dl dt {
	background:linear-gradient(#008CBB, #00B9EF);
	color:#FFF;
	font-size:22px;
	font-weight:bold;
	text-align:center;
	padding:5px;
	margin-bottom:10px;
}

#eyeeco .sec02 ul li dl dt .fsm {
	font-size:14px;
}

#eyeeco .sec02 ul li dl dd {
	font-size:15px;
	padding:10px 20px;
}

#eyeeco .sec02 ul li dl dd .fss {
	font-size:13px;
}



/* sec03 */

#eyeeco .sec03 {
	width:720px;
	margin:50px auto 30px;
}

#eyeeco .sec03 img.right_img {
	float:right;
	width:245px;
}

#eyeeco .sec03 .left {
	width:460px;
	float:left;
}

#eyeeco .sec03 .left h3 {
	font-size: 26px;
    font-weight: bold;
    color: #1A4B83;
    margin-bottom: 10px;
}



/**************** 使用方法 ****************/

#eyeeco .how_to h2 {
	text-align:center;
	margin-bottom:30px;
}

#eyeeco .how_to h2 {
	text-align:center;
	margin-bottom:30px;
}

#eyeeco .how_to ul.use {
	width:740px;
	margin:0 auto 20px;
}

#eyeeco .how_to ul.use li {
	width:170px;
	font-size:14px;
	line-height:1.4;
	padding-left:5px;
	padding-right:5px;
	float:left;
	margin-right:15px;
	margin-bottom:20px;
}
#eyeeco .how_to ul.use li:nth-child(4n) {
	margin-right:0;
}
#eyeeco .how_to ul.use li:nth-child(4n+1) {
	clear:both;
}

#eyeeco .how_to ul.use li img {
	margin:0 auto 15px;
}

#eyeeco .how_to dl.minutes {
	width:360px;
	float:left;
	margin-bottom:50px;
}

#eyeeco .how_to dl.minutes dt {
	width:120px;
	background:#F6AB00;
	color:#FFF;
	text-align:center;
	font-size:16px;
	font-weight:bold;
	border-radius:10px;
	padding:20px 10px;
	float:left;
}

#eyeeco .how_to dl.minutes dd {
	width:220px;
	font-size:20px;
	color:#1F4C7E;
	font-weight:bold;
	float:right;
}

#eyeeco .how_to dl.minutes dd .orange {
	color:#F6AB00;
}

#eyeeco .how_to p.notice {
	width:360px;
	font-size:14px;
	color:#F6AB00;
	font-weight:bold;
	margin-bottom:50px;
	float:right;
}

#eyeeco .how_to dl.cool {
	width:720px;
	margin:50px auto 0;
}

#eyeeco .how_to dl.cool dt {
	width:170px;
	float:left;
}

#eyeeco .how_to dl.cool dd {
	width:520px;
	float:right;
}

#eyeeco .how_to dl.cool dd h3 {
	color:#1F4C7E;
	font-size:18px;
	text-align:left;
	background:#f8f8f8;
	font-weight:bold;
	line-height:1.4;
	margin:0 0 10px 0;
}

#eyeeco .how_to dl.cool dd p {
	font-size:15px;
	margin-bottom:10px;
}

#eyeeco .how_to dl.cool dd p.kome {
	font-size:13px;
}


}



@media screen and (max-width:767px){
/*----------------------------------------------------------------------

SP Style

----------------------------------------------------------------------*/

/**********************************************************/
/* メインエリア */
/**********************************************************/

main h2 {
	color:#666;
	font-size:28px;
	font-weight:600;
	letter-spacing:3px;
    text-align: center;
	margin-bottom:50px;
	line-height:1.3;
}

main h2 span.sub {
	font-size:18px;
	letter-spacing:0;
}


main h3 {
	font-size: 24px;
    font-weight: bold;
    color:#20ABD9;
    text-align: center;
    margin-bottom: 5px;
}

.tocart .detail a {
  clear: both;
}


/* 商品概要 */

#product_info {
	margin-bottom:50px;
}

#product_info .left {
}

#product_info .left img {
	display:block;
	margin-bottom:10px;
}

#product_info .right {
}
#product_info .right p.catch {
  text-align: center;
}

#product_info .right p.remedy {
	font-size:15px;
	margin-bottom:20px;
	position: relative;
    padding-left:20px;
}
#product_info .right p.remedy:before {
        background: #20ABD9;
        content: "";
        height: 10px;
        width: 10px;
        left: 0;
        position: absolute;
        top: 7px;
}

#product_info .right p.explanation {
	font-size:17px;
	line-height:1.7;
	margin:40px 0 20px;
}

#product_info .right p.price {
	color:#20ABD9;
	font-size:22px;
	margin-bottom:20px;
}
#product_info .right p.price span {
	font-size:14px;
}

#product_info .right a {
	display:inline-block;
	text-align:center;
	padding:10px 15px;
	color:#FFF;
	font-size:18px;
	letter-spacing:1px;
	font-weight:600;
	margin-bottom:15px;
}

#product_info .right a.buy {
	width:150px;
	background:#20ABD9;
	margin-right:10px;
}

#product_info .right a.subscription {
	width:300px;
	background:#FF91A2;
}

#product_info .right p.discount {
	width:460px;
	color:#FF6C83;
	font-size:16px;
	letter-spacing:1px;
	text-align:center;
	padding:5px;
	border:solid 1px #FF91A2;
}


/**************** 商品紹介 ****************/

/* sec01 */

#eyeeco .sec01 .info {
	width:100%;
	border-left:5px solid #B4E4E4;
	border-right:5px solid #B4E4E4;
	margin:10px auto 0;
}

#eyeeco .sec01 .info:before,
#eyeeco .sec01 .info:after {
	content:"";
	display:block;
	height:5px;
	width:100%;
	background:-webkit-gradient(linear, left top, right bottom, from(#B4E4E4), to(#B4E4E4));
	background:-moz-linear-gradient(left, #B4E4E4, #B4E4E4);
	background:linear-gradient(left, #B4E4E4, #B4E4E4);
}

#eyeeco .sec01 .info .inner {
	width:100%;
	padding:20px 3% 0;
}

#eyeeco .sec01 .info .inner ul {
	width:100%;
	margin:0 auto;
}

#eyeeco .sec01 .info .inner ul li {
	width:100%;
	margin-bottom:30px;
}

#eyeeco .sec01 .info .inner ul li h3 {
	text-align:center;
	color:#FFF;
	font-size:18px;
	font-weight:bold;
	line-height:36px;
	background:linear-gradient(#008CBB, #00B9EF);
	margin-bottom:20px;
	margin-top:30px;
}

#eyeeco .sec01 .info .inner ul li p {
	margin-bottom:10px;
}


/* sec02 */

#eyeeco .sec02 ul {
	width:100%;
	margin:10px auto 0;
}

#eyeeco .sec02 ul li {
	width:100%;
	margin-bottom:20px;
}

#eyeeco .sec02 ul li dl {
	border:solid 1px #B4E4E4;
}

#eyeeco .sec02 ul li dl dt {
	background:linear-gradient(#008CBB, #00B9EF);
	color:#FFF;
	font-size:22px;
	font-weight:bold;
	text-align:center;
	padding:5px;
	margin-bottom:10px;
}

#eyeeco .sec02 ul li dl dt .fsm {
	font-size:16px;
}

#eyeeco .sec02 ul li dl dd {
	font-size:15px;
	padding:10px 20px;
}

#eyeeco .sec02 ul li dl dd img {
	display:block;
	width:80%;
	margin:0 auto;
}

#eyeeco .sec02 ul li dl dd .fss {
	font-size:13px;
}


/* sec03 */

#eyeeco .sec03 {
	width:100%;
	margin:30px auto 15px;
}

#eyeeco .sec03 .left {
	width:100%;
}

#eyeeco .sec03 .left h3 {
	font-size: 20px;
    font-weight: bold;
    color: #1A4B83;
    margin-bottom: 10px;
}



/**************** 使用方法 ****************/

#eyeeco .how_to h2 {
	text-align:center;
	margin-bottom:15px;
}

#eyeeco .how_to ul.use {
	width:90%;
	margin:0 auto 20px;
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  gap:20px 0;
}

#eyeeco .how_to ul.use li {
  width:48%;
	font-size:14px;
	line-height:1.4;
}

#eyeeco .how_to ul.use li img {
	margin:0 auto 10px;
}

#eyeeco .how_to dl.minutes {
	width:100%;
	margin-bottom:20px;
}

#eyeeco .how_to dl.minutes dt {
	width:50%;
	padding:10px 20px;
	margin:0 auto 15px;
	background:#F6AB00;
	color:#FFF;
	text-align:center;
	font-size:18px;
	font-weight:bold;
	border-radius:10px;
}

#eyeeco .how_to dl.minutes dd {
	width:80%;
	text-align:center;
	margin:0 auto; 
	font-size:18px;
	color:#1F4C7E;
	font-weight:bold;
}

#eyeeco .how_to dl.minutes dd .orange {
	color:#F6AB00;
}

#eyeeco .how_to p.notice {
	width:80%;
	font-size:14px;
	color:#F6AB00;
	font-weight:bold;
	margin:20px auto;
}

#eyeeco .how_to dl.cool {
	width:100%;
	margin:30px auto 0;
}

#eyeeco .how_to dl.cool dt {
	width:35%;
	margin:0 auto 20px;
}

#eyeeco .how_to dl.cool dd {
	width:100%;
}

#eyeeco .how_to dl.cool dd h3 {
	color:#1F4C7E;
	font-size:18px;
	text-align:left;
	background:#f8f8f8;
	font-weight:bold;
	line-height:1.4;
	margin:0 0 10px 0;
}

#eyeeco .how_to dl.cool dd p {
	font-size:15px;
	margin-bottom:10px;
}

#eyeeco .how_to dl.cool dd p.kome {
	font-size:13px;
}

.hid {
  padding: 20px 5% !important;
}





}