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

body {
    font-family: "メイリオ", "ヒラギノ角ゴ Pro W3";
}

#header_top {
background: #2a933a;
}
 
.top_area {
width: 950px;
margin: 0 auto;
clear: both;
position: relative;
height: 29px;
line-height: 1.4;
}

.top_area h1 {
font-size: 12px;
float: left;
color: #fff;
font-weight: normal;
margin-top: 6px;
width: 470px;
text-overflow: ellipsis;
white-space: nowrap;
overflow: hidden;
text-align: left;
}

.top_area ul {
float: right;
display: flex;
list-style: none;
padding: 0;
margin: 6px 55px 0 0;
}

.top_area ul li {
color: #fff;
padding: 0 10px;
font-size: 12px;
border-right: solid 1px #257801;
}

.top_area ul li a {
color: #fff !important;
}

.top_area ul li:last-child {
border-right: none;
}

.top_area div {
position: absolute;
top: 0;
right: 0;
background: #fff !important;
}

#header_second {
width: 950px;
margin: 0 auto;
margin-bottom: 5px;
padding-top: 15px;
}

.logo_area {
overflow: hidden;
clear: both;
}

/* ここからリニューアル後に削除 */
.logo {
float: left !important;
width: 175px !important;
height: 50px !important;
position: static !important;
}

.year {
float: left;
width: 67px;
height: 50px;
margin-left: 18px;
}
/* ここまでリニューアル後に削除 */



/* ここからリニューアル用 */
.logo_new_area {
overflow: hidden;
clear: both;
margin-bottom: 16px;
}

.logo_dekirukun {
float: left !important;
width: 196px !important;
height: 41px !important;
position: static !important;
}

.year17 {
float: left;
width: 67px;
height: 41px;
margin-left: 8px;
}
/* ここまでリニューアル用 */

.tvcm {
float: left;
margin-left: 12px;
margin-top: 2px;
height: 44px;
}


/* ここからリニューアル用 */
.wp_voice {
display: block;
width: 147px;
height: 40px;
float: left;
margin-left: 26px;
background: url(https://www.sunrefre.jp/img/header/btn_wp_voice.png) no-repeat;
}

.wp_voice a {
font-size: 12px;	
color: #fff !important;
display: block;
}

.wp_voice a:hover {
text-decoration: none;
opacity: 0.7;
}

.wp_voice a span div {
margin-left: 71px;
margin-top: 12px;
letter-spacing: 0.7em;	;
color: #fff;
}

.wp_blog {
display: block;
width: 162px;
height: 40px;
float: left;
margin-left: 14px;
background: url(https://www.sunrefre.jp/img/header/btn_wp_blog.png) no-repeat;
}

.wp_blog a {
display: block;
font-size: 12px;
color: #fff !important;
}

.wp_blog a:hover {
text-decoration: none;
opacity: 0.7;	
}

.wp_blog a span div {
margin-left: 70px;
margin-top: 12px;
letter-spacing: 0.7em;
color: #fff;
}


/* staff blog 新規追加 2018/11/09 */
.wp_staff {
display: block;
width: 163px;
height: 40px;
float: left;
margin-left: 14px;
background: url(https://www.sunrefre.jp/img/header/btn_wp_staff.png) no-repeat;
}

.wp_staff a {
display: block;
font-size: 12px;
color: #fff !important;
}

.wp_staff a:hover {
text-decoration: none;
opacity: 0.7;	
}

.wp_staff a span div {
margin-left: 87px;
margin-top: 12px;
letter-spacing: 0.7em;
color: #fff;
}

/* ここまでリニューアル用 */



/* ここからリニューアル後に削除 */
.wp_01 {
display: block;
float: left;
margin-left: 65px;
font-size: 12px;
}

.wp_01 a {
background: url(https://www.sunrefre.jp/img/header/wp_sprite.png) no-repeat;
background-position: 0px -44px;
width: 120px;
height: 44px;
display: block;
color: #222 !important;
}

.wp_01 a:hover {
background-position: 0px 0px;
text-decoration: none;
}

.wp_02 {
display: block;
width: 120px;
height: 44px;
float: left;
}

.wp_02 a {
background: url(https://www.sunrefre.jp/img/header/wp_sprite.png) no-repeat;
background-position: -123px -44px;
width: 120px;
height: 44px;
display: block;
font-size: 12px;
color: #222 !important;
}

.wp_02 a:hover {
background-position: -123px 0px;
text-decoration: none;
}

.wp_03 {
display: block;
width: 120px;
height: 44px;
float: left;
}

.wp_03 a {
background: url(https://www.sunrefre.jp/img/header/wp_sprite.png) no-repeat;
background-position: -245px -44px;
width: 120px;
height: 44px;
display: block;
font-size: 12px;
color: #222 !important;
}

.wp_03 a:hover {
background-position: -245px 0px;
text-decoration: none;
}

.wp_01 span {
display: flex;
margin-left: 37px;
padding-top: 5px;
line-height: 1.6;
}

.wp_02 span {
display: block;
margin-left: 34px;
padding-top: 5px;
line-height: 1.6;
}

.wp_03 span {
display: block;
margin-left: 37px;
padding-top: 5px;
line-height: 1.6;
}
/* ここまでリニューアル後に削除 */

ul.navi_area li.gastable_header_icon {
    width: 93px;
    text-align: center;
}
.cart {
float: left;
/*margin-left: 74px;*/
}

.ec a {
margin-left: 12px;
width: 67px;
height: 54px;
background: url(https://www.sunrefre.jp/img/header/btn_ec.png) no-repeat;
display: block;
text-indent: -9999px;
margin-top: 3px;
}

.ec a:hover {
background: url(https://www.sunrefre.jp/img/header/btn_ec_on.png) no-repeat;
border-bottom: none !important;
}

#header_third {
background: #f6f6f6;
border-top: solid 1px #eee;
border-bottom: solid 1px #eee;
padding: 8px 0;
height: 27px;
}

.guide_area {
width: 950px;
margin: 0 auto;
overflow: hidden !important;
clear: both !important;
}

.guide {
float: left;
}

.sarch {
float: left;
width: 250px;
height: 30px;
}

table.gsc-search-box td {
vertical-align: top !important;
}

.cse .gsc-search-button input.gsc-search-button-v2, input.gsc-search-button-v2 {
margin-top: 0 !important;
}

.notice {
background: url(https://www.sunrefre.jp/img/header/notice.png) repeat-x;
height: 29px;
}

.f_wp_01 {
font-size: 11px !important;
color: #ff0000;
}





/* テレビCM 回転ボタン部分 */
#header_second .tvcm .button {
	display: inline-block;
	width: 100px;
	height: 44px;
	text-align: center;
	text-decoration: none;
	line-height: 44px;
	outline: none;
	position: relative;
	-webkit-perspective: 1000px;
	perspective: 1000px;
}
#header_second .tvcm .button::before,
#header_second .tvcm .button::after {
	position: absolute;
	z-index: -1;
	display: block;
	content: '';
}
#header_second .tvcm .button,
#header_second .tvcm .button::before,
#header_second .tvcm .button::after {
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	-webkit-transition: all .1s;
	transition: all .1s;
}
#header_second .tvcm .button span {
	display: block;
	position: absolute;
	width: 100px;
	height: 44px;
	/*border: 2px solid #ccc;*/
	text-align: center;
	line-height: 56px;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	-webkit-transition: all .3s;
	transition: all .3s;
	pointer-events: none;
}
#header_second .tvcm .button span:nth-child(1) {
	background-color: #fff;
	color: #777;
	-webkit-transform: rotateX(90deg);
	-moz-transform: rotateX(90deg);
	transform: rotateX(90deg);
	-webkit-transform-origin: 50% 50% -30px;
	-moz-transform-origin: 50% 50% -30px;
	transform-origin: 50% 50% -30px;
	border: solid 1px #ccc;
}
#header_second .tvcm .button span:nth-child(2) {
	background-color: #fff;
	color: #fff;
	-webkit-transform: rotateX(0deg);
	-moz-transform: rotateX(0deg);
	transform: rotateX(0deg);
	-webkit-transform-origin: 50% 50% -30px;
	-moz-transform-origin: 50% 50% -30px;
	transform-origin: 50% 50% -30px;
}
#header_second .tvcm .button:hover span:nth-child(1) {
	-webkit-transform: rotateX(0deg);
	-moz-transform: rotateX(0deg);
	transform: rotateX(0deg);
}
#header_second .tvcm .button:hover span:nth-child(2) {
	background-color: #fff;
	-webkit-transform: rotateX(-90deg);
	-moz-transform: rotateX(-90deg);
	transform: rotateX(-90deg);
}
#header_second .tvcm .button img {
    vertical-align: top;
}

/* 帯下　告知部分 */
.top_notice {
width: 950px;
margin: 0 auto;
overflow: hidden;
clear: both;
margin-top: 10px;
font-size: 14px;
border: solid 1px #ddd;
line-height: 1.5;
box-sizing: border-box;
}

.top_notice dt {
    float: left;
    background: #ddd;
    padding: 5px;
    width: 165px;
    text-align: center;
}

.top_notice dd {
margin-left: 194px;
padding: 5px;
text-align: left;
}

.top_notice dd a {
color: #222 !important;
text-decoration: underline !important;
}
/*
#header_Information dd:after {
content: "｜";
margin-left: 20px;
}*/
#header_Information dd:last-child:after {
content: none;
}

.nav_01 {
	font-size: 11px;
	position: absolute;
	top: 47px;
	left: 20px;
}

.nav_02 {
	font-size: 11px;
	position: absolute;
	top: 47px;
	left: 5px;
}

.nav_03 {
	font-size: 11px;
	position: absolute;
	top: 47px;
	left: 4px;
	letter-spacing: -1px;
}

.nav_03 {
	font-size: 11px;
	position: absolute;
	top: 47px;
	left: 3px;
}

.nav_04 {
	font-size: 11px;
	position: absolute;
	top: 47px;
	left: 17px;
}

.nav_05 {
	font-size: 11px;
	position: absolute;
	top: 47px;
	left: 17px;
}

.nav_06 {
	font-size: 11px;
	position: absolute;
	top: 47px;
	left: 17px;
}

.nav_07 {
	font-size: 11px;
	position: absolute;
	top: 47px;
	left: 0px;
	letter-spacing: -2px;
}

.nav_08 {
	font-size: 11px;
	position: absolute;
	top: 47px;
	left: 23px;
	letter-spacing: 1px;
}

.nav_09 {
	font-size: 11px;
	position: absolute;
	top: 47px;
	left: 5px;
	letter-spacing: -1px;
}

.nav_10 {
	font-size: 11px;
	position: absolute;
	top: 47px;
	left: 19px;
}

.nav_11 {
	font-size: 11px;
	position: absolute;
	top: 47px;
	left: 4px;
}

.nav_12 {
	font-size: 11px;
	position: absolute;
	top: 47px;
	left: 13px;
}

.nav_13 {
	font-size: 11px;
	position: absolute;
	top: 47px;
	left: 2px;
	letter-spacing: -0.8px;
}

.nav_14 {
	font-size: 11px;
	position: absolute;
	top: 47px;
	left: 14px;
}



.wp_btn_box {
	float: left;
	width: 622px;
	/*width: 300px;*/
	margin-left: 10px;
}
.wp_btn_box a {
	text-decoration: none !important;
}
.wp_btn_cp {
	padding: 9px 8px 6px 8px;
	display: inline-block;
	/*background: #ec5f59;*/
	/*border-radius: 2px;*/
	/*border: solid 1px #ec5f59;*/
	font-size: 13px;
	color: #222;
	/*font-weight: bold;*/
	/*margin-left: 5px;*/
	text-decoration: underline;
}
.wp_btn01 {
	padding: 9px 8px 6px 8px;
	display: inline-block;
	background: #fff;
	border-radius: 2px;
	border: solid 1px #ec914f;
	font-size: 13px;
	color: #222;
	margin-left: 5px;
}
.wp_btn02 {
	padding: 9px 8px 6px 8px;
	display: inline-block;
	background: #fff;
	border-radius: 2px;
	border: solid 1px #719fe5;
	font-size: 13px;
	color: #222;
	margin-left: 5px;
}
.wp_btn03 {
	padding: 9px 8px 6px 8px;
	display: inline-block;
	background: #fff;
	border-radius: 2px;
	border: solid 1px #8dc570;
	font-size: 13px;
	color: #222;
	margin-left: 5px;
}

.wp_btn_cp:hover {
	/*background: #fff;*/
	/*color: #ec5f59;*/
	transition: all .2s;
}
.wp_btn01:hover {
	background: #ec914f;
	color: #fff;
	transition: all .2s;
}
.wp_btn02:hover {
	background: #719fe5;
	color: #fff;
	transition: all .2s;
}
.wp_btn03:hover {
	background: #8dc570;
	color: #fff;
	transition: all .2s;
}

.wp_btn_cp_on {
	padding: 9px 10px 6px 10px;
	display: inline-block;
	background: #ec914f;
	/*margin-right: 5px;*/
	border-radius: 2px;
	border: solid 1px #ec914f;
	font-size: 13px;
	color: #fff;
}
.wp_btn01_on {
	padding: 9px 8px 6px 8px;
	display: inline-block;
	background: #ec914f;
	/*margin-right: 5px;*/
	border-radius: 2px;
	border: solid 1px #ec914f;
	font-size: 13px;
	color: #fff;
	margin-left: 5px;
}
.wp_btn02_on {
	padding: 9px 8px 6px 8px;
	display: inline-block;
	background: #719fe5;
	/*margin-right: 5px;*/
	border-radius: 2px;
	border: solid 1px #719fe5;
	font-size: 13px;
	color: #fff;
	margin-left: 5px;
}
.wp_btn03_on {
	padding: 9px 8px 6px 8px;
	display: inline-block;
	background: #8dc570;
	border-radius: 2px;
	border: solid 1px #8dc570;
	font-size: 13px;
	color: #fff;
	margin-left: 5px;
}



/* クレジットカード入力フォーム内｢ご利用可能カード｣のimgの大きさ指定 */
#credit div.section.cardBrand p.logo {
    width: auto !important;
    height: auto !important;
    float:none !important;
}

@media screen and (max-width: 640px) {

.top_notice { width: 90%; }
.top_notice dt { width: 100%; }
.top_notice dd { text-align: left !important; margin: 0 !important; }
.top_notice dd a { font-size: 12px; !important; }
.top_notice dt {
    float: none;
}
}