@charset "utf-8";

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

.js #menu {
	display:none;
}

.js .slicknav_menu {
	display:block;
}

#headerArea {
/*	height: 100px;*/			/* ヘッダ領域の高さはここで調整 */
	min-height:74px;
	margin: 0px;
	border: none;
	padding: 13px 0 0;
	background-image: url(https://image.pia.jp/images3/sumo/renew-sumo-head_base.jpg);
	background-repeat: repeat-x;
}

#headerArea:after {
	clear: both;
}

#h_navi {
	width: 232px;			/* ヘッダ領域の横幅はここで調整 */
	min-width: 100%;		/* ヘッダ領域の横幅はここで調整 */
	height: 87px;			/* ヘッダ領域の高さはここで調整 */
	margin: 0;
	border: none;
	padding: 0px;
	/*background-image:url(https://image.pia.jp/images3/sumo/renew-sumo-logo.png);*/
  background-image:url(https://image.pia.jp/images3/sumo/head_logo_sp.png);
	background-position: center top;
	background-repeat: no-repeat;
	-webkit-background-size: 232px 71px;
}

#h_navi #home {
	display: block;
	margin: 0 auto;
	width: 232px;
	height: 74px;
	/*float: left; */
}

#h_navi #home a {
	display: block;
	width: 100%; /*変更*/			/* ヘッダロゴのクリックできる範囲はここで調整 */
	height: 100%; /*変更*/
	border: none;
	padding: 0px;
	text-indent: -9999px;
}

#h_navi_en {
	width: 232px;			/* ヘッダ領域の横幅はここで調整 */
	min-width: 100%;		/* ヘッダ領域の横幅はここで調整 */
	height: 87px;			/* ヘッダ領域の高さはここで調整 */
	margin: 0;
	border: none;
	padding: 0px;
	background-image:url("https://image.pia.jp/images3/sumo/head_logo_en_sp.png");
	background-position: center center;
	background-repeat: no-repeat;
	-webkit-background-size: 232px 63px;
}

#h_navi_en #home {
	display: block;
	margin: 0 auto;
	width: 232px;
	height: 82px;
	/*float: left; */
}

#h_navi_en #home a {
	display: block;
	width: 100%; /*変更*/			/* ヘッダロゴのクリックできる範囲はここで調整 */
	height: 100%; /*変更*/
	border: none;
	padding: 0px;
	text-indent: -9999px;
}

#mypage_area,
#sub_menu.en{
	display: none;
}

#mypage_area_sp {
   background-color:#ffffff;
}

#mypage_area_sp .sp-login-hold {
    padding: 7px 0;
    width: 100%;
	overflow: hidden;
    font-size: 12px;
}

#mypage_area_sp .sp-login-hold:after {
	clear: both;
}

#mypage_area_sp .sp-login-hold .ttl {
	float: left;
	margin: 0 0 0 4px;
}

#mypage_area_sp .sp-login-hold .links {
	float: right;
	margin: 0 4px 0 0;
}

#mypage_area_sp .sp-login-hold a {
	color: #ff8c00;
}

#mypage_area_sp .sp-top-nav {
    background: none repeat scroll 0 0 #fff;
    border: 1px solid #898989;
    box-shadow: 0 3px 0 #ccc;
    font-size: 12px;
    margin: 0 1px 0px;
    display: block;
    padding: 7px;
    box-sizing: border-box;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    -ms-box-sizing: border-box;
    -o-box-sizing: border-box;
}

#mypage_area_sp .sp-top-nav ul {
    text-align: center;
    width: 100%;
    list-style: outside none none;
}


#mypage_area_sp .sp-top-nav ul li {
    display: inline;
    padding: 0 5px 0 3px;
    border-right: 1px solid #000;
    box-sizing: border-box;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    -ms-box-sizing: border-box;
    -o-box-sizing: border-box;
}

#mypage_area_sp .sp-top-nav ul li:last-child {
	border-right: none;
}


#mypage_area_sp #header_menu a:link ,
#mypage_area_sp #header_menu a:visited ,
#mypage_area_sp #header_menu a:active ,
#mypage_area_sp #header_menu a:hover {
	text-decoration: none;
	color: #333;
}

}


@media only screen and (min-width: 769px) {
#wrapper{
  width:100%;
}

.js #menu {
	display:block;
}

.js .slicknav_menu {
	display:none;
}

/* ---------- ---------- ---------- ---------- ---------- */
#headerArea {
    width:100%;
	height: 100px;			/* ヘッダ領域の高さはここで調整 */
	margin: 0px;
	border: none;
	padding: 0px;
	background-image: url(https://image.pia.jp/images3/sumo/renew-sumo-head_base.jpg);
	background-position: top;
	background-repeat: repeat-x;
}

/* ---------- ---------- ---------- ---------- ---------- */
#h_navi {
	width: 980px;			/* ヘッダ領域の横幅はここで調整 */
	height: 100%;			/* ヘッダ領域の高さはここで調整 */
	margin: 0px auto;
	border: none;
	padding: 0px;
	/*background-image:url(https://image.pia.jp/images3/sumo/renew-sumo-logo.png);*/
  background: url("https://image.pia.jp/images3/sumo/head_logo_pc.png") left 50% no-repeat;
	background-position: left 50%;
	background-repeat: no-repeat;
}

#h_navi #home {
	display: block;
	width: 670px; /*変更*/
	height: 100%;
	margin: 0px;
	float: left;
}
#h_navi #home a {
	display: block;
	width: 232px; /*変更*/			/* ヘッダロゴのクリックできる範囲はここで調整 */
	height: 100%; /*変更*/
/*	padding: 10px 0px 0px 5px; /*変更*/
	border: none;
	padding: 0px;
	text-indent: -9999px;
    box-sizing: border-box;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    -ms-box-sizing: border-box;
    -o-box-sizing: border-box;
}

#h_navi_en {
	width: 980px;			/* ヘッダ領域の横幅はここで調整 */
	height: 100%;			/* ヘッダ領域の高さはここで調整 */
	margin: 0px auto;
	border: none;
	padding: 0px;
	background-image:url(https://image.pia.jp/images3/sumo/head_logo_en_pc.png);
	background-position: left 50%;
	background-repeat: no-repeat;
}

#h_navi_en #home {
	display: block;
	width: 670px; /*変更*/
	height: 100%;
	margin: 0px;
	float: left;
}
#h_navi_en #home a {
	display: block;
	width: 232px; /*変更*/			/* ヘッダロゴのクリックできる範囲はここで調整 */
	height: 100%; /*変更*/
/*	padding: 10px 0px 0px 5px; /*変更*/
	border: none;
	padding: 0px;
	text-indent: -9999px;
    box-sizing: border-box;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    -ms-box-sizing: border-box;
    -o-box-sizing: border-box;
}

/* ---------- ---------- ---------- ---------- ---------- */
#mypage_area_sp {
	display: none;
}

#mypage_area,
#mypage_area_en{
	text-align:left;
	width: 300px !important;
	padding: 17px 0px 0px !important; /*変更*/
	float: left;
}
#mypage_area #sub_menu {
	/*width: auto;
	margin: 0px;
	border: none;
	padding: 0px;
	background: none*/
	height:12px;
	margin:0;
	text-align:left;
	background: url(https://image.pia.jp/images3/sumo/my_page_area/renew-sumo-s_navi.png) no-repeat 0px 0px;
	position:static;
}
  
#mypage_area_en #sub_menu.en{
	height:12px;
	margin:0;
	text-align:left;
	background: url(https://image.pia.jp/images3/sumo/my_page_area/sumo-s_navi-en.png) no-repeat 0px 0px;
	position:static;
}

#mypage_area #sub_menu ul {
	margin: 0;
    padding: 0;
    list-style: none;
    position:relative;
}

#mypage_area #sub_menu ul li {
	margin: 0;
	padding: 0;
	height:15px;
	text-indent: -9999px;
	position:absolute;
}

#mypage_area #sub_menu ul li a {
	display: block;
	height: 15px;
	text-decoration: none;
}

#mypage_area #sub_menu li#h01 {
	left:0px;
	top:0;
	width:70px;
}
#mypage_area #sub_menu li#h02 {
	left:86px;
	top:0;
	width: 39px;
}
#mypage_area #sub_menu li#h03 {
	left:141px;
	top:0;
	width:69px;
}
#mypage_area_en #sub_menu.en li#h03 {
	left:141px;
	top:0;
	width:69px;
}

#mypage_area #sub_menu li#h01 a:hover ,#mypage_area #sub_menu li#h01 strong {
	background: url(https://image.pia.jp/images3/sumo/my_page_area/renew-sumo-s_navi.png);
	background-position: 0px -19px;
	background-repeat: no-repeat;
}
#mypage_area #sub_menu li#h02 a:hover ,#mypage_area #sub_menu li#h01 strong {
	background: url(https://image.pia.jp/images3/sumo/my_page_area/renew-sumo-s_navi.png);
	background-position:  -86px -19px;
	background-repeat: no-repeat;
}
#mypage_area #sub_menu li#h03 a:hover ,#mypage_area #sub_menu li#h01 strong {
	background: url(https://image.pia.jp/images3/sumo/my_page_area/renew-sumo-s_navi.png);
	background-position: -141px -19px;
	background-repeat: no-repeat;
}
#mypage_area_en #sub_menu.en li#h03 a:hover ,#mypage_area #sub_menu.en li#h03 strong {
	background: url(https://image.pia.jp/images3/sumo/my_page_area/sumo-s_navi-en.png);
	background-position: -141px -19px;
	background-repeat: no-repeat;
}

}