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

/*
phone.html
#phone
#value
#monthly
#comparison
#cost
*/



/*================================================================================
	ひかり電話プランページ
================================================================================*/
#phone h2 { color:#1b6aa1; font-weight:normal; }
#value h5 { color:#1b6aa1; }
#monthly h4 { color:#1b6aa1; font-weight:normal; }
#cost h4 { color:#1b6aa1; }
#cost p span { color:#e61673; }


/*================================================================================
	Media screen : PC 750px
================================================================================*/
@media screen and (min-width: 751px) {

p { letter-spacing:1px; }

/* phone */
#phone h2 { width:540px; float:left; padding-left:10px; box-sizing:border-box; }
#phone h2 { font-size:36px; line-height:140%; padding-top:25px; }
#phone h4 { width:410px; float:left; }
#phone p { clear:both; }

/* value */
#value li { width:50%; float:left; box-sizing:border-box; }
#value li:nth-child(1) { padding-right:5px; }
#value li:nth-child(2) { padding-left:5px; }
#value li div { padding:25px 15px; background-color:#e5e5e1; border-radius:10px; }
#value li h3 { background:none; margin-bottom:0; height:100px; }
#value li h3 span { font-size:24px; }
#value li h4 { font-size:24px; font-weight:normal; text-align:center; margin-bottom:30px; }
#value li h5 { font-size:17px; line-height:180%; }
#value li img { margin-top:15px; }
#value li div div { padding:15px; padding-top:25px; background-color:#fff; height:465px; }
#value li p { font-size:13px; padding:30px; }

/* monthly */
#monthly h4 { font-size:24px; letter-spacing:2px; margin-bottom:25px; }
#monthly img:nth-of-type(2) { display:none; }

/* comparison */
#comparison h3 span { display:block; font-size:38px; margin-bottom:8px; }
#comparison p { font-size:13px; }
#comparison ul { margin-top:30px; margin-bottom:20px; }
#comparison li { width:430px; height:220px; background-color:#e5e5e1; border-radius:10px; float:left; }
#comparison li:nth-child(1) { margin-left:40px; margin-right: 5px; }
#comparison li:nth-child(2) { margin-left: 5px; margin-right:40px; }
#comparison li h4 { width:100%; height:0; padding-top:68px; overflow:hidden; }
#comparison li:nth-child(1) h4 { background:url(../images/phone/ttl_ph_gh1.png) no-repeat 50% 0; }
#comparison li:nth-child(2) h4 { background:url(../images/phone/ttl_ph_gh2.png) no-repeat 50% 0; }
#comparison li p { font-size:14px; padding:5px 30px 0; }
#comparison img:nth-of-type(2) { display:none; }

/* cost */
#cost h4 { font-size:24px; font-weight:normal; letter-spacing:1px; margin-bottom:40px; }
#cost h4 span { font-size:18px; margin-top:10px; display:block; }
#cost h4 br { display:none; }
#cost p { margin-top:20px; line-height:180%; }
#cost img:nth-of-type(2) { display:none; }

}

/*================================================================================
	Media screen : SP 750px
================================================================================*/
@media screen and (max-width: 750px) {

/* phone */
#phone h2 { margin-bottom:20px; text-align:center; }
#phone h4 { margin-bottom:15px; }

/* value */
#value .wrap { padding:0; }
#value li { border-bottom:40px solid #e5e5e1; margin-bottom:20px; padding-bottom:30px; }
#value li h3 { margin-bottom:30px; padding:15px; padding-bottom:20px; background:none; background-color:#e5e5e1; font-size:40px; }
#value li h3 span { font-size:24px; }
#value li h4 { font-size:24px; font-weight:normal; text-align:center; margin-bottom:30px; }
#value li h5 { font-size:16px; line-height:180%; font-weight:normal; }
#value li p { margin:20px 15px 0; }
#value li:nth-child(1) img { margin-top:30px; }
#value li div div { padding:15px; }

/* monthly */
#monthly h4 { font-size:18px; text-align:center; margin-bottom:20px; }
#monthly h4 span { display:block; font-size:24px; }
#monthly img:nth-of-type(1) { display:none; }

/* comparison */
#comparison h3 span { display:block; font-size:20px; margin-bottom:1px; }
#comparison ul { margin-top:15px; }
#comparison li { background-color:#e5e5e1; border-radius:10px; margin-bottom:15px; padding-bottom:15px; }
#comparison li h4 { width:100%; height:0; padding-top:41px; overflow:hidden; }
#comparison li:nth-child(1) h4 { background:url(../images/phone/ttl_ph_gh1_sp.png) no-repeat 50% 0; background-size:336px 41px; }
#comparison li:nth-child(2) h4 { background:url(../images/phone/ttl_ph_gh2_sp.png) no-repeat 50% 0; background-size:336px 41px; }
#comparison li p { padding:5px 15px 0; }
#comparison img:nth-of-type(1) { display:none; }

/* cost */
#cost h4 { font-size:15px; font-weight:normal; text-align:center; margin-bottom:10px; }
#cost h4 span { font-size:12px; margin-top:5px; display:block; }
#cost p { margin-top:15px; line-height:180%; }
#cost img:nth-of-type(1) { display:none; }

}


/*================================================================================
	clearfix
================================================================================*/
#phone .wrap:after,
#value ul:after,
#comparison ul:after {
	visibility: hidden;
	display: block;
	font-size: 0;
	content: " ";
	clear: both;
	height: 0;
}
/* clearfix for ie7 */
#phone .wrap,
#value ul,
#comparison ul {
	display: inline-block;
}
#phone .wrap,
#value ul,
#comparison ul {
	display: block;
}

