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

body,html{
	width:100%;
	height:100%;
}

#wrapper {
	width:100%;
	min-height:100%;
	margin: 0 auto;
	position: relative;
	overflow:hidden;
}


/*メガネグラム用*/
@font-face {
   font-family: Noto Sans JP;
   src:url(../fonts/NotoSansJP-Regular.otf) format("opentype");
}

span.gram{
  font-family: 'Noto Sans JP', sans-serif;
  font-weight:normal;
}



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

     HEADER (COMMON)
	 
---------------------------------------------------*/

#header{
	width:100%;
	height:70px;
	z-index:990;
	position:fixed;
	top:0;
	left:0;
	background-color:#FFFFFF;
	/*display:none*/
}

.header-inner{
	width:960px;
	height:70px;
	margin:0 auto;
	position:relative;
}

.header-inner > h1{
	position:absolute;
	top:15px;
	left:50px;
	display:block;
	width:60px;
}

.header-inner > h1 img{
	width:100%;
	height:auto;
}

/*SNS*/
.social_btn {
  display:block;
  position:absolute;
  top:24px;
  right:20px;
  text-align:right;
}
.social_btn li {
  display:inline-block;
  vertical-align: top;
  text-align:right;
}
.social_btn .fb_iframe_widget span {
  vertical-align: top !important;
}
.social_btn iframe {
  max-width: none !important;
}

.social_btn li+li {
	margin-left:10px;
}


.hidden {
  background-color:rgba(255,255,255,0.8);
  transition: all 0.5s ease;
}








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

    フッター前マージン調整
	 
---------------------------------------------------*/

.index-wrapper,
.inner-wrapper{
	width:100%;
	height:100%;
}

.index-wrapper{
	margin-bottom:200px;
}

/* IE10以上 */
@media all and (-ms-high-contrast: none){
.index-wrapper,
.inner-wrapper{
	padding-bottom:150px; /*フッターの高さ*/
	}
}

/* Edge */
@supports (-ms-ime-align: auto) {
.index-wrapper,
.inner-wrapper{
	padding-bottom:1px;
	}
}

/*Firefox*/
/*@-moz-document url-prefix() {
.index-wrapper,
.inner-wrapper{
	padding-bottom:150px; /*フッターの高さ*/
	/*}
}*/




.last{
	margin-bottom:200px !important;
}

/* IE10以上 */
@media all and (-ms-high-contrast: none){
.last{
	  margin-bottom:200px !important;;
  }
}

/*Firefox*/
@-moz-document url-prefix() {
.last {
	margin-bottom:50px !important; /*フッターとの空き*/
	}
}

@media screen and (max-width: 960px) {
.last{
	margin-bottom:50px !important;
}
}










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

    メイン
	 
---------------------------------------------------*/
.main{
	width:100%;
	min-height:750px;
	background:url(../images/common/main_back.png) repeat-x center top #103795;
	margin-top:70px;
}
.main p {
	width:830px;
	margin:0 auto;
	font-size:10px;
	color:#fff;
	position:absolute;
	bottom:30px;
	right:65px;
}
.main-box{
	width:960px;
	min-height:750px;
	margin:0 auto;
	position:relative;
	background:url(../images/common/main.png) no-repeat center top;
}

.main-back{
	width:960px;
	min-height:750px;
	margin:0 auto;
	position:relative;
	background:url(../images/common/main.png) no-repeat center top;
}


.main-copy{
	width:100%;
	height:auto;
	position:absolute;
	top:0;
	left:0px;
	display: block;
	background-color: #e5d15e;
	z-index: 99;
	text-align: center;
	margin-top: 70px;
}
.main-copy img{
	width:960px;
}
.main .sub-copy{
	width:321px;
	height:auto;
	position:absolute;
	top:80px;
	right:36px;
}
.main .sub_sub-copy{
	width:275px;
	height:auto;
	position:absolute;
	top:193px;
	right:207px;
}
.main .title-copy{
	widows: 665px;
	height:auto;
	position:absolute;
	top:590px;
	left:178px;
}

.main .btn01,
.main .btn02,
.main .btn04,
.main .btn03{
	display:block;
	width:191px;
	height:60px;
	position:absolute;
	top:650px;
	background:url(../images/common/main_btn_back.png) no-repeat center center;
	background-size:191px auto;
}

.main .btn01 a,
.main .btn02 a,
.main .btn04 a,
.main .btn03 a{
	display:block;
	width:191px;
	height:60px;
	text-align:center;
	color:#0051A4;
	font-weight:bold;
	line-height:60px;
	text-decoration:none;
}

.main .btn03 a{
	line-height:1.5;
	padding-top:8px;
}

.main .btn04 a{
	line-height:1.5;
	padding-top:8px;
}


.main .btn01{
	left:85px;
}

.main .btn02{
	right:285px;
}
.main .btn04{
	left:285px;
}
.main .btn03{
	right:85px;
}
.main .btn04{
	right:85px;
}
.main .btn01:hover,
.main .btn02:hover,
.main .btn04:hover,
.main .btn03:hover{
	opacity: 0.5;
	filter: alpha(opacity=50);
	-ms-filter: "alpha(opacity=50)";
	-webkit-transition: all .3s;
	transition: all .3s;
}

.main .main-copy img,
.main .sub-copy img,
.main .title-copy img{
	display:block;
	width:100%;
	height:auto;
}


/*NEWS*/
.news{
	width:880px;
	color:#0051A4;
	border-bottom:1px #003894 dashed;
	margin:0 auto;
	padding-top:30px;
	padding-bottom:15px;
}

.news dl{
	display:block;
	width:740px;
	margin:0 auto;
}

.news dl dt{
	float:left;
	width:80px;
	background:url(../images/common/arrow.png) no-repeat right center;
	background-size:10px auto;
	font-weight:bold;
}

.news dl dd{
	float:right;
	width:640px;
}

.news:after{
	content: "";
    clear: both;
	display: block;
}








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

   コンテンツ
	
---------------------------------------------------*/

/*共通幅*/
.cont-box{
	width:820px;
	height:auto;
	position:relative;
	margin:0 auto;
}

.cont-box:after{
	content: "";
    clear: both;
	display: block;
}


/*ラクトフェリンって何？*/
.cont01{
	width:100%;
	height:auto;
	/*background:url(../images/common/L_logo.png) no-repeat 820px -100px;
	background-size:466px;*/
	padding:100px 0;
	position:relative;
}

.cont01 .cont-box .L-logo{
	width:234px;
	height:auto;
	position:absolute;
	top:0;
	right:0;
}

.cont01 .cont-box .L-logo img{
	width:100%;
	height:auto;
}

.cont01 .cont-box h2{
	font-size:40px;
	font-weight:bold;
	color:#0250a3;
	margin-bottom:30px;
}

.cont01 .cont-box hr{
	height: 8px;
	background-color: #0051A4;
	width: 200px;
	border: none;
	text-align:left;
	margin:0;
	margin-bottom:40px;
}

.cont01 .cont-box h3{
	font-size:32px;
	font-weight:bold;
	margin-bottom:30px;
}

.cont01 .cont-box p{
	font-size:16px;
	font-weight:bold;
	margin-bottom:60px;
}

.cont01 .cont-box ul{
	margin-bottom:50px;
}

.cont01 .cont-box ul li{
	display:block;
	width:380px;
	min-height:200px;
	float:left;
	background:url(../images/common/line.png) no-repeat center 60px;
	background-size:auto 4px;
}

.cont01 .cont-box ul li:nth-child(1),
.cont01 .cont-box ul li:nth-child(2){
	margin-bottom:30px;
}

.cont01 .cont-box ul li:nth-child(1),
.cont01 .cont-box ul li:nth-child(3){
	margin-right:60px;
}

.cont01 .cont-box ul li h4{
	font-size:16px;
	color:#0051A4;
	text-align:center;
	line-height:50px;
	padding-bottom:10px;
	margin-bottom:20px;
	font-weight:bold;
}

.cont01 .cont-box ul li:nth-child(2) h4,
.cont01 .cont-box ul li:nth-child(3) h4{
	line-height:1.6;
}

.cont01 .cont-box ul li p{
	font-size:14px;
	color:#0051A4;
	font-weight:normal;
	margin-bottom:0px;
}

.cont01 .cont-box ul:after{
	content: "";
    clear: both;
	display: block;
}

.cont01 .cont-box a{
	display:block;
	width:712px;
	height:auto;
	margin:0 auto;
}

.cont01 .cont-box a img{
	display:block;
	width:100%;
	height:auto;
}

/*.cont01 .cont-box a:hover{
	opacity: 0.5;
	filter: alpha(opacity=50);
	-ms-filter: "alpha(opacity=50)";
	-webkit-transition: all .3s;
	transition: all .3s;
}*/




/*商品情報*/
.cont02{
	width:100%;
	height:auto;
	background:url(../images/common/products_back.png) no-repeat center top;
	padding-top:100px;
}

.cont02 .cont-box{
	color:#FFFFFF;
	margin-bottom:100px;
	position: relative;
}

.cont02 .cont-box h2{
	font-size:40px;
	font-weight:bold;
	color:#FFFFFF;
	margin-bottom:30px;
}

.cont02 .cont-box hr{
	height: 8px;
	background-color: #FFFFFF;
	width: 200px;
	border: none;
	text-align:left;
	margin:0;
	margin-bottom:40px;
}

.cont02 .cont-box div{
	display:block;
	float:left;
	width:380px;
}

.cont02 .cont-box div + div{
	margin-left:60px;
}

.cont02 .cont-box div h3{
	font-size:16px;
	text-align:center;
	background:url(../images/common/products_arrow.png) no-repeat center bottom;
	background-size:150px auto;
	padding-bottom:15px;
	margin-bottom:30px;
}

.cont02 .cont-box div img{
	display:block;
	width:auto;
	height:275px;
	margin:0 auto;
}

.cont02 .cont-box div h4{
	font-size:19px;
	text-align:center;
	margin-bottom:15px;
}

.cont02 .cont-box div p{
	font-size:14px;
	margin-bottom:15px;
}

.cont02 .cont-box div h5{
	width:5em;
	border:1px #FFFFFF solid;
	text-align:center;
	padding:3px 0;
	margin-bottom:10px;
}

.cont02 .cont-box div table{
	width:100%;
	margin-bottom:15px;
}

.cont02 .cont-box div table th{
	width:30%;
	font-weight:normal;
	text-align:left;
}

.cont02 .cont-box div table td{
}

.cont02 .cont-box div table th,
.cont02 .cont-box div table td{
	border-bottom:1px #FFFFFF solid;
	padding:2px 0;
}

.cont02 .cont-box div table tr:last-child th,
.cont02 .cont-box div table tr:last-child td{
	border-bottom:none;
}

.cont02 .cont-box div:after{
	content: "";
    clear: both;
	display: block;
}

.cont02 .pattern{
	width:100%;
	height:30px;
	margin-top: -50px;
	background:url(../images/common/products_pattern.png) repeat-x center top #0051A4; 
}



/*4つのポイントでしっかり体調管理*/
.cont03{
	width:100%;
	height:auto;
	padding:100px 0;
}

.cont03 .cont-box h2{
	font-size:40px;
	font-weight:bold;
	color:#0051A4;
	margin-bottom:30px;
	line-height:1.4;
}

.cont03 .cont-box h2 span{
	display:block;
	font-size:26px;
	font-weight:normal;
}

.cont03 .cont-box hr{
	height: 8px;
	background-color: #0051A4;
	width: 200px;
	border: none;
	text-align:left;
	margin:0;
	margin-bottom:40px;
}

.cont03 .cont-box ul{
}

.cont03 .cont-box ul li{
	display:block;
	width:390px;
	min-height:600px;
	float:left;
	border:5px #00B3F2 solid;
	padding:40px;
	position:relative;
	background:url(../images/common/line.png) no-repeat center 80px #fff;
	background-size:80px 4px;
}

.cont03 .cont-box ul li:nth-child(3),
.cont03 .cont-box ul li:nth-child(4){
	min-height:300px;
}

.cont03 .cont-box ul li:nth-child(1),
.cont03 .cont-box ul li:nth-child(3){
	margin-right:40px;
}

.cont03 .cont-box ul li:nth-child(1),
.cont03 .cont-box ul li:nth-child(2){
	margin-bottom:40px;
}

.cont03 .cont-box ul li img.illust{
	display:block;
	width:auto;
	height:163px;
	margin:0 auto 20px;
}

.cont03 .cont-box ul li h4{
	font-size:22px;
	font-weight:bold;
	color:#db0e1f;
	text-align:center;
	margin-bottom:40px;
}

.cont03 .cont-box ul li p{
	font-size:14px;
	color:#0051A4;
}

.cont03 .cont-box ul li span{
	display:block;
	width:30px;
	position:absolute;
	top:0;
	left:0;
}

.cont03 .cont-box ul li span img{
	width:100%;
	height:auto;
}





/*森永乳業の健康ヨーグルト*/
.cont05{
	width:100%;
	height:auto;
	padding-bottom:100px;
	text-align:center;
}

.cont05 .cont-box{
	width:820px;
}

.cont05 .cont-box h2{
	font-size:27px;
	font-weight:bold;
	color:#00A63C;
	margin-bottom:30px;
	line-height:1;
}

.cont05 .cont-box hr{
	height: 8px;
	background-color: #00A63C;
	width: 150px;
	border: none;
	margin:0 auto;
	margin-bottom:40px;
}

.cont05 .cont-box a{
	display:block;
	float:left;
	font-size:27px;
	color:#00A63C;
	width:390px;
	border:1px #063489 solid;
	text-decoration:none;
}
.cont05 .cont-box a img{
	width: 100%;
}
.cont05 .cont-box a + a{
	margin-left:35px;
}

.cont05 .cont-box a:hover{
	filter:alpha(opacity=50);
	-moz-opacity: 0.5;
	opacity: 0.5;
	-webkit-transition: all .3s;
	transition: all .3s;
}








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

    PAGE TOP BOTTAN
	
---------------------------------------------------*/
.pagetop {
	width:260px;
	height:50px;
	margin:0 auto;
}

.pagetop a{
	display:block;
	width:260px;
	height:50px;
	background:url(../images/common/arrow_up.png) no-repeat 30px center #009FE8;
	background-size:15px auto;
	color:#FFFFFF;
	font-size:18px;
	text-align:center;
	line-height:50px;
	border-radius:10px;
	text-decoration:none;
	font-weight:bold;
	padding-left:15px;
}

.pagetop:hover{
    opacity: 0.5;
	filter: alpha(opacity=50);
	-ms-filter: "alpha(opacity=50)";
	-webkit-transition: all .3s;
	transition: all .3s;
}
















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

     FOOTER (COMMON)
	 
---------------------------------------------------*/

footer{
	width:100%;
	height:150px;
	position:absolute;
	bottom:0;
	background-color:#E6E7E7;
	/*display:none;*/
}

.footer-inner{
	width:820px;
	margin:0 auto;
	position:relative;
}

.footer-inner ul{
	margin-top:35px;
}

.footer-inner ul li{
	float:left;
}

.footer-inner ul li+li{
	margin-left:1em;
}

.footer-inner ul li.copyright{
	clear:left;
	margin-left:0;
	color:#003894;
	font-size:10px;
	margin-top:10px;
}

.footer-inner ul li a{
	font-size:12px;
	color:#003894;
}

a.logo{
	display:block;
	width:150px;
	position:absolute;
	top:40px;
	right:0;
}

a.logo img{
	display:block;
	width:100%;
	height:auto;
}

p.copyright{
	width:100%;
	text-align:center;
	color:#FFFFFF;
}




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

    20200310追加
	 
---------------------------------------------------*/
.font_200310red {
	color: #ea0929!important;
}
.font_200310_01_back{
	width:100%;
	background:url(../images/common/news_back.png) repeat-x top center;
}
.font_200310_02_back{
	width:100%;
	background:url(../images/common/news_back.png) repeat-x center -300px;
}
.font_200310_03_back{
	width:100%;
	background:url(../images/common/20200311_back_01.png) no-repeat center bottom;
	margin-bottom: 50px;
}
.info_20200311_sub {
	width: 335px!important;
	position: absolute;
	top: 0;
	right: 0;
}
.info_20200311_sub img {
	width: 100%!important;
	height: auto!important;
}


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

    20200325追加
	 
---------------------------------------------------*/
.font_200325_01_back{
	width:100%;
	background:url(../images/common/news_back.png) repeat-x top center;
}




/*医師の95％が推奨*/
.cont04{
	width:100%;
	height:auto;
	/*background:url(../images/common/L_logo.png) no-repeat 820px -100px;
	background-size:466px;*/
	padding:100px 0;
	position:relative;
	text-align: left;
}

.cont04 .cont-box .L-logo{
	width:140px;
	height:auto;
	position:absolute;
	top:0;
	right:0;
}

.cont04 .cont-box .L-logo img{
	width:100%;
	height:auto;
}

.cont04 .cont-box h2{
	font-size:40px;
	font-weight:bold;
	color:#0250a3;
	margin-bottom:30px;
}
.cont04 .cont-box sup {
	font-weight:normal;
	font-size: 50%;
	vertical-align: 10px;
}
.cont04 .cont-box hr{
	height: 8px;
	background-color: #0051A4;
	width: 200px;
	border: none;
	text-align:left;
	margin:0;
	margin-bottom:40px;
}

.cont04 .cont-box h3{
	font-size:32px;
	font-weight:bold;
	margin-bottom:30px;
}

.cont04 .cont-box p{
	font-size:16px;
	font-weight:bold;
	margin-bottom:60px;
}
.cont04 .cont-box .co_20200325_box {
	width: 100%;
}
.cont04 .cont-box .co_20200325_box img {
	float: left;
	width: 450px;
}
.cont04 .cont-box .co_20200325_box .red20200325_box {
	float: right;
	font-size: 10px;
	color: #003894;
	width: 298px;
	margin-top: 80px;
}
.cont04 .cont-box .co_20200325_box{
	content: "";
    clear: both;
	display: block;
}



/*20230106*/
.bnr_20230106_box{
	width: 820px;
	display: block;
	margin: 0 auto;
	padding-bottom: 50px;
}
.bnr_20230106_box a:hover{
	opacity: 50%;
}