@charset "utf-8";

body { font-size: 80%; 
  font-family: "Noto Sans Regular", "Hiragino Sans", "Hiragino Kaku Gothic ProN", "ヒラギノ角ゴ ProN W3", "ヒラギノ角ゴ Pro W3", "メイリオ", "Meiryo", "ＭＳ Ｐゴシック", sans-serif;
}

.clr 									{ font-size: 1px;line-height: -1px;margin: 0px;padding: 0px;clear: both;height: 1px; }
div#Main							{ width: 640px;	background-color:#ffffff;	background-position: left bottom;	margin-bottom: 50px;}

#container #MainContainer #Main p							{ font-size:12px; padding:0; margin:0; line-height:2.0em; letter-spacing: 0; } 
#container #MainContainer #Main .bold						{ font-weight:bold; } 
#container #MainContainer #Main b							{ color:#f82871; }

#container #MainContainer #Main h2						{ padding:0; margin:0; line-height: 0; } 
#container #MainContainer #Main h3						{ padding:0; margin:0 0 10px 0; } 
#container #MainContainer #Main h4						{ padding:0; margin:0; } 
#container #MainContainer #Main h5						{ padding:0; margin:0 0 10px 0; }
div#Main .contents												{ border-left:solid 8px #fdd900; border-right:solid 8px #fdd900; width:600px; padding:12px; }
div#Main .contents .btm10									{ margin:0 0 10px 0; }
div#Main .contents .btm20									{ margin:0 0 20px 0; }
div#Main .contents .bx01									{ background:url(../images/nettyusho_bg01.gif) left top no-repeat; width:600px; height:290px; position:relative; margin:0 0 20px 0; }
div#Main .contents .bx01 .commbx							{ width:310px; position:absolute; top:26px; left:264px; }
div#Main .contents .commbx p								{ line-height:2.2em; }
div#Main .contents .bx02									{ background:url(../images/nettyusho_bg02.gif) left top no-repeat; width:600px; height:294px; position:relative; margin:0 0 20px 0; }
div#Main .contents .bx02 .commbx							{ width:310px; position:absolute; top:26px; left:28px; }
div#Main .contents .bx03									{ background:url(../images/nettyusho_bg03.gif) left top no-repeat; width:600px; height:305px; position:relative; margin:0 0 20px 0; }
div#Main .contents .bx03 .commbx							{ width:315px; position:absolute; top:26px; left:264px; }
div#Main .contents .bx04									{ background:url(../images/nettyusho_bg04.gif) left top no-repeat; width:600px; height:295px; position:relative; margin:0 0 20px 0; }
div#Main .contents .bx04 .commbx							{ width:310px; position:absolute; top:26px; left:28px; }
div#Main .cntbtm												{ background:url(../images/nettyusho_bgbtm.gif) left top no-repeat; width:640px; height:13px; }



#container #MainContainer #Main .BtnApply		{ text-align:center; padding:20px 0 40px 0; }


#container #MainContainer #Main .sns							{ background:#ffffff; width:600px; padding:10px 20px 0 20px; }
#container #MainContainer #Main .sns .snsbtn01				{ float:left; }
#container #MainContainer #Main .sns .snsbtn02				{ float:left; margin:0 0 0 10px; }
div#Main .contents2												{ width:600px; padding:20px; }
#container #MainContainer #Main .contents2 p	{ font-size:12px; padding:0; margin:0; line-height:2.2em; }
div#Main .contents2 h2										{ padding:0 0 40px 0; }
div#Main .contents2 .btm10								{ margin:0 0 10px 0; }
div#Main .contents2 .btm20								{ margin:0 0 20px 0; }
div#Main .contents2 .intbx01 .lef						{ float:left; }
div#Main .contents2 .intbx01 .rig						{ float:right; width:320px; }
div#Main .contents2 .intbx01 .intsbx					{ padding:10px 0 40px 0; }
div#Main .contents2 .intbx02 .lef						{ float:left; width:320px; }
div#Main .contents2 .intbx02 .rig						{ float:right; }
div#Main .contents2 .intbx02 .intsbx					{ padding:10px 0 40px 0; }
div#Main .contents2 .profile								{ position:relative; background:url(../images/int_profbg.gif) left top no-repeat; width:600px; height:174px; margin:0 0 20px 0; }
div#Main .contents2 .profile p								{ position:absolute; top:76px; left:16px; width:565px; }  						

#container #MainContainer								{ text-align: center; }
#container #MainContainer #Main					{ margin: 0 auto 40px auto; width: 640px; text-align: left; }

#container #MainContainer .bnrArea				 {  width: 630px;  background-color: #f7f7f7;  margin: 50px auto 100px; text-align:left;}
#container #MainContainer .bnrArea a:hover	 {  opacity: 0.6;}
#container #MainContainer .bnrArea .area_Ttl	 {  background-color: #68c9f3;  color: #FFF;  font-size: 20px;  padding: 7px 15px;}
#container #MainContainer .bnrArea .bnrbx 	 {  padding: 20px;  overflow: hidden; }
#container #MainContainer .bnrArea .bnrbx .bnrImg	 {  float: left;}
#container #MainContainer .bnrArea .bnrbx .bnrText	 {  float: left; width: 380px; margin-left:30px; margin-top:15px; font-size: 14px;color:#333; }
#container #MainContainer .bnrArea .bnrbx .bnrText .bnrTtl 	{ font-size: 24px;  border-bottom: 1px solid #666; margin-bottom:15px; color:#444; display: inline-block; font-family: "Noto Sans Bold" !important;}
#container #MainContainer .bnrArea .bnrbx .bnrText p				{ font-size: 14px; }


/*　人気のウォーターサーバー　*/
.newlife-popular {
    padding: 60px 0 30px;
    background: #f7f7f7;
  }
  .newlife-popular-wrap {
    width: 960px;
    text-align: center;
    margin: auto;
  }
  
  .newlife-popular .ttl {
    display: inline-block;
    font-size: 25px;
    padding: 0 330px;
    line-height: 1;
    color: #444;
    white-space: nowrap;
    font-feature-settings: "palt";
    letter-spacing: 0.16rem;
    background: url(../images/water_line.svg) left center no-repeat, url(../images/water_line.svg) right center no-repeat;
    background-size: 280px 10px;
    font-family: "Noto Sans Bold" !important;
    font-weight: 700;
    box-sizing: border-box;
  }
  
  .newlife-popular .lifestyle-rank-list {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-pack: justify;
        justify-content: space-between;
    margin: 40px auto 40px;
  }
  
  .newlife-popular .lifestyle-rank-list > li {
    width: 224px;
    height: 400px;
    padding: 20px 10px 10px;
    border-radius: 8px;
    background: #fff;
    text-align: center;
    box-sizing: border-box;
  }
  
  .newlife-popular .lifestyle-rank-list > li a {
    display: block;
  }
  
  .newlife-popular .lifestyle-rank-list > li a:hover {
    opacity: 0.7;
  }
  
  .newlife-popular .lifestyle-rank-list .pop-txt {
    font-size: 15px;
    letter-spacing: 0;
  }
  


/*　server-btn　*/
  .server-btn {
    margin: 23px auto 25px;
  }
  
  .server-btn a {
    position: relative;
    background: #a9d600;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-pack: center;
        justify-content: center;
    -ms-flex-align: center;
        align-items: center;
    height: 50px;
    line-height: 50px;
    margin: 0 auto;
    color: #fff;
    text-align: center;
    border-radius: 5px;
    font-size: 19px;
    transition: all 400ms cubic-bezier(0.23, 1, 0.32, 1) 0ms;
    /* easeOutQuint */
  }
  
  .server-btn a:hover {
    background: #c7f618;
  }
  
  .server-btn a span {
    letter-spacing: -2px;
    color: #FFF;
    padding-right: 20px;
  }

  .server-btn a span.arrow {
    margin: auto;
    top: 0;
    bottom: 0;
    right: 10px;
    display: inline-block;
    position: absolute;
    width: 20px;
    height: 20px;
    padding: 0;
  }
  
  .server-btn a span.arrow img {
    vertical-align: top;
  }

