@charset "UTF-8";

/*--------------------------------------------------------
★レスポンシブ■ヘッダ部分
--------------------------------------------------------*/
@media screen and (min-width: 481px) {
	.pc_none{
		display: none!important;
	}
}
@media screen and (max-width: 480px) {
	html{
		max-width: 480px;
		width: 100%;
		overflow-x: hidden;
		-webkit-text-size-adjust: 100%!important;
	}
	body {
		max-width: 480px;
		min-width: 320px;
		width: 100%;
		-webkit-text-size-adjust: 100%;
		-ms-text-size-adjust: 100%;
		text-size-adjust: 100%;
		font-size: 16px;
		line-height: 1.4em;
		letter-spacing: 0.05em;
		overflow-x: hidden!important;
		-webkit-text-size-adjust: 100%!important;
	}
	.sp_none{
		display: none!important;
	}

	.header {
		position: fixed;
		display: block;
		max-width: 480px;
		min-width: 320px;
		width: 100%;
		height: 60px;
		top: 0;
		left: 0;
		border-width: 2px;
	}
	.header_inner{
		width: 100%;
		margin: auto;
	}
	.header_menu,.header_menu_control{
		display: none;
	}
	#rd_logo a{
		position: relative;
		display: block;
		float: left;
		width: 35%;
		height: 58px;
		margin-left: 2%;
		text-indent: -9999px;
		background: url(../images/sp_logo.jpg) no-repeat left center;
		-webkit-background-size: contain;
		background-size: contain;
	}
	.w_40 #rd_logo a{
		width: 45%;
	}
	#globalNav{
		position: relative;
		display: block;
		list-style:none;
		width: 60%;
		height: 60px;
		float: right;
	}
	.w_40 #globalNav{
		width: 40%;
	}
	#globalNav li a{
		position: relative;
		display: block;
		float: left;
		text-decoration: none;
		list-style:none;
		font-size: 8px;
		color:#222;
		font-weight: 600;
		line-height: 1em;
		border-left: 1px solid #efefef;
		width: 33%;
		height: 10px;
		padding: 44px 1% 14px;
		text-align: center;
	}
	.w_40 #globalNav li a{
		width: 50%;
	}
	#globalNav li.login_btn a{
		background: url(../images/login_icon.png) no-repeat center 28%;
		-webkit-background-size: 25px;
		background-size: 25px;
	}
	#globalNav li.signup_btn a{
		background: #E35600 url(../images/signup_icon.png);
		background-position: center 28%;
		background-repeat: no-repeat;
		-webkit-background-size: 25px;
		background-size: 25px;
		color: #FFF;
	}
	#globalNav li:hover{
	  background: #fafafa;
	}

	@media only screen and (orientation:landscape) {
		#rd_header{
			position: absolute;
			max-width: 480px;
			width: 100%;
		}
		#topcontrol{
			display: none!important;
		}
	}

	#panel-btn-icon{
		position: absolute;
		display: block;
		top: 36%;
		left: 50%;
		width: 20px;
		height: 3px;
		margin: -1px 0 0 -10px;
		background: #792F2D;
		transition: .2s;
	}
	#panel-btn-icon:before, #panel-btn-icon:after{
		content: "";
		position: absolute;
		display: block;
		width: 20px;
		height: 3px;
		top: 50%;
		left: 0;
		background: #792F2D!important;
		transition: .3s;
	}
	#panel-btn-icon:before{
		margin-top: -8px;
	}
	#panel-btn-icon:after{
		margin-top: 6px;
	}
	#panel-btn .close{
		background: transparent;
	}
	#panel-btn .close:before, #panel-btn .close:after{
		margin-top: 0;
	}
	#panel-btn .close:after{
		background: #792F2D!important;
		transform: rotate(-45deg);
		-webkit-transform: rotate(-45deg);
	}
	#panel-btn .close:before{
		transform: rotate(-135deg);
		-webkit-transform: rotate(-135deg);
	}
	#panel {
		position: absolute;
		display: none;
		width: 100%;
		height: auto;
		margin: 0;
		padding: 12px 0 74%;
		background: rgba(234,212,190,0.8);
		-webkit-background-size: cover;
		background-size: cover;
		top: 60px;
		left: 0;
		z-index: 1000;
	}
	.w_40 #panel{
		padding-bottom: 66%;
	}
	#panel_nav{
		position: absolute;
		display: block;
		list-style-type: none;
		width: 100%;
		padding: 1%;
		box-sizing: border-box;
	}
	#panel_nav li{
		position: relative;
		display: block;
		float: left;
		width: 31%;
		height: auto;
		margin: 1%;
	}
	#panel_nav li:nth-child(4),
	#panel_nav li:nth-child(5),
	#panel_nav li:nth-child(6),
	#panel_nav li:nth-child(7),
	#panel_nav li:nth-child(8),
	#panel_nav li:nth-child(9),
	#panel_nav li:nth-child(10),
	#panel_nav li:last-child{
		width: 46%;
		margin: 0 2% 2%;
	}
	#panel_nav li a{
		position: relative;
		display: block;
		width: 100%;
		height: auto;
	}
	#panel_nav li:nth-child(10) a img,
	#panel_nav li:last-child a img{
		position: relative;
		display: block;
		width: 100%;
		height: auto;
	}
	#panel_nav li a:hover{
		opacity: 0.8;
	}
	.box_4 li:first-child,.box_4 li:nth-child(2),
	.box_4 li:nth-child(3),.box_4 li:nth-child(4){
		width: 23%!important;
		margin: 1%!important;
	}
	.box_4 li:nth-child(8){
		clear: none!important;
		float: left!important;
	}

	/* top_page */
	.main{
		min-width: 320px;
		padding-top: 60px;
	}
	.hero{
		min-width: 320px;
		width: 100%;
		background-color: #444;
		text-align: center;
	}
	.content{
		width: 94%!important;
		margin: auto;
		padding: 40px 3%;
	}
	.content_title{
		font-size: 22px;
		font-size: 2.2rem;
		line-height: 1.4em;
		margin-bottom: 15px;
	}
	.content_title-bar{
		font-size: 18px;
		font-size: 2rem;
	}
	.content_body-pl{
		padding: 2%;
	}
	._doubleBorder {
		padding: 7%!important;
	}
	.content_body_title{
		font-size: 20px;
		font-size: 2rem;
		line-height: 1.5em;
		padding: 0.4em;
	}
    .content_body_title-small {
		font-size: 20px;
		font-size: 2rem;
		letter-spacing: 0.04em;
		line-height: 1.2em;
		margin-bottom: .3em;
	}
	.content_body_text {
		font-size: 16px!important;
		font-size: 1.6rem!important;
		margin-bottom: 2em;
	}
	.grid-2_item{
		clear: both;
		float: none;
		width: 100%;
		height: auto;
		margin: 0 auto 4%;
	}
	._tac{
		position: relative;
		display: block;
		margin-top: -20px;
		margin-bottom: -10px;
	}
	.homeFeedback_image{
		clear: both;
		float: none;
		width: 50%;
		margin: 0 auto 10px;
	}
	.homeFeedback_image ._tac{
		width: 100%;
		height: auto;
		margin: 0 auto;
	}
	.homeFeedback_info{
		clear: both;
		float: none;
		width: 100%;
	}
	.homeFeedback_text {
		font-size: 16px;
		font-size: 1.6rem;
		height: auto;
	}
	._btn-big{
		font-size: 24px;
		font-size: 2.4rem;
		padding: 1em;
	}
	form{
		margin-top: 30px;
	}

	/* footer */
	.bannerArea{
		min-width: 320px;
		width: 100%;
		margin: 0 auto;
		padding: 6%;
	}
	.bannerArea .wrapper{
		width: 100%;
	}
	.bannerArea a{
		position: relative;
		display: block;
		width: 100%;
		height: auto;
		margin: 0 auto 20px;
	}

	.footer{
		min-width: 320px;
		width: 100%;
		padding: 6%;
		border-width: 2px;
	}
	.footer_inner{
		width: 100%;
		margin: auto;
	}
	.footer_inner .grid-4 .grid-4_item:first-child,
	.footer_inner .grid-4 .grid-4_item:nth-child(2),
	.footer_inner .grid-4 .grid-4_item:nth-child(3){
		display: none;
	}
	.footer_inner .grid-4 .grid-4_item:nth-child(4){
		width: 100%!important;
	}
	.footer_logotxt{
		font-size: 14px;
		font-size: 1.4rem;
		padding-top: 20px;
	}
	.footer_btn{
		width: 100%;
		font-size: 16px;
		font-size: 1.6rem;
	}
    .footer_btn_blog{
    	float: left;
    	width: 32%;
		height: 50px;
		margin-bottom: 10px;
		margin-right: 2%;
	}
    .footer_btn_twitter{
    	float: left;
    	width: 32%;
		height: 50px;
		margin-bottom: 10px;
		margin-right: 2%;
	}
    .footer_btn_facebook{
    	float: right;
    	width: 32%;
		height: 50px;
	}
	.footer_copy {
		font-size: 12px;
		font-size: 1.2rem;
		padding-bottom: 120px;
	}

	._mt120 {
		margin-top: 60px;
	}

	/* 会員情報ページ */
	.breadcrumbs{
		width: 100%;
		margin: 20px auto 0;
		box-sizing: border-box;
	}

	.content_body-bg .grid-4_item{
		clear: both;
		float: none;
		width: 90%;
		height: auto;
		margin: 0 auto;
	}
	.content_body-bg .grid-4_item .favoriteCard{
		display: block;
		margin: 20px auto 40px;
	}
	.content_body-bg .grid-4_item .favoriteCard img{
		max-width: auto;
		width: 100%;
		height: auto;
	}
	.profile_control{
		clear: both;
		float: none;
		width: 90%;
		margin: 0 auto 40px;
	}
	.profile_control_image img{
		max-width: auto;
		width: 100%;
		height: auto;
	}
	.profile_prof_table{
		max-width: 280px;
		height: auto;
		margin: 0 auto;
		box-sizing: border-box;
	}
	.profile_prof{
		clear: both;
		float: none;
		width: 100%;
		padding-left: 0;
	}
	.profile_prof_table_title{
		position: relative;
		display: block;
		clear: both;
		float: none;
		min-width: 276px;
		width: 100%;
		height: auto;
		font-size: 16px;
		font-size: 1.6rem;
		padding: 0.5em;
		box-sizing: border-box;
	}
	.profileTable_title{
		position: relative;
		display: block;
		clear: both;
		float: none;
		min-width: 276px;
		width: 100%;
		font-size: 16px;
		font-size: 1.6rem;
		padding: 0.5em;
		box-sizing: border-box;
	}
	.profile_prof_table_body{
		position: relative;
		display: block;
		clear: both;
		float: none;
		min-width: 276px;
		width: 100%;
		font-size: 16px;
		font-size: 1.6rem;
		padding: 0.5em;
		box-sizing: border-box;
	}
	.profileTable_body{
		position: relative;
		display: block;
		clear: both;
		float: none;
		min-width: 276px;
		width: 100%;
		font-size: 16px;
		font-size: 1.6rem;
		padding: 0.5em;
		box-sizing: border-box;
	}

	/* search */
	.search_item_title_sub{
		position: relative;
		display: block;
		top: auto;
		right: auto;
		margin: 10px auto 0;
		text-align: left;
	}
	.search_item-expand{
		margin-bottom: 20px;
	}
	.search_item_body{
		clear: both;
		float: none;
		width: 100%;
		margin: 0 auto;
	}
	input[type=text], input[type=password]{
		font-size: 16px;
		font-size: 1.6rem;
	}
	._btn-large{
		font-size: 20px;
		font-size: 2rem;
	}
	.searchResult {
		padding-bottom: 0;
	}
	.searchResult_prof_wrapper{
		display: none!important;
	}
	.searchResult_prof h2{
		position: absolute;
		display: block;
		margin-top: -122%;
	}
	@media screen and (max-width: 458px) {
		.searchResult_prof h2{
			margin-top: -125%;
		}
	}
	@media screen and (max-width: 430px) {
		.searchResult_prof h2{
			margin-top: -129%;
		}
	}
	@media screen and (max-width: 400px) {
		.searchResult_prof h2{
			margin-top: -132%;
		}
	}
	@media screen and (max-width: 380px) {
		.searchResult_prof h2{
			margin-top: -135%;
		}
	}
	@media screen and (max-width: 360px) {
		.searchResult_prof h2{
			margin-top: -139%;
		}
	}
	@media screen and (max-width: 340px) {
		.searchResult_prof h2{
			margin-top: -142%;
		}
	}

	/* mylist */
	.searchResult{
		margin-top: 60px;
	}
	.searchResult_control{
		clear: both;
		float: none;
		width: 90%;
		margin: 0 auto 40px;
	}
	.searchResult_control img{
		max-width: auto;
		width: 100%;
		height: auto;
	}
	.searchResult_prof{
		clear: both;
		float: none;
		width: 100%;
		padding-left: 0;
		margin: 0 auto;
	}
	.searchResult_prof_item{
		clear: both!important;
		float: none!important;
		width: 100%;
		height: auto;
		margin: 0 auto 10px;
	}
	.searchResult-sort{
		font-size: 16px;
		font-size: 1.6rem;
		text-align: left;
	}
	.mylistNav{
		width: 248px;
		margin: 0 auto;
	}

	/* mail */
	.mailList_item_body{
		height: auto;
	}
	.mailList_item_body_title{
		font-size: 14px;
		font-size: 1.4rem;
	}
	.mailList_item_body_text{
		font-size: 16px;
		font-size: 1.6rem;
		letter-spacing: 0.05em;
		line-height: 1.4em;
	}
	.mailDetail_item_control_title{
		font-size: 18px;
		font-size: 1.8rem;
	}
	.mailDetail_item_body{
		font-size: 16px;
		font-size: 1.6rem;
		letter-spacing: 0.04em;
		line-height: 1.5em;
		padding: 0 0 20px;
	}

	/* setting */
	.profileNav_item{
		width: 100%;
		border-bottom: 2px solid #ead4be;
	}
	.editTable{
		max-width: 280px;
		height: auto;
		margin: 0 auto;
		box-sizing: border-box;
	}
	.editTable_title{
		position: relative;
		display: block;
		max-width: 276px;
		width: 100%;
		font-size: 16px;
		font-size: 1.6rem;
		padding: 0.5em;
		box-sizing: border-box;
	}
	.editTable_body{
		position: relative;
		display: block;
		clear: both;
		float: none;
		min-width: 276px;
		width: 100%;
		font-size: 16px;
		font-size: 1.6rem;
		padding: 0.5em;
		box-sizing: border-box;
	}
	._required{
		position: relative;
		display: block;
		padding-left: 0;
		line-height: 1.4em;
		margin-top: 10px;
	}
	.select-short{
		width: 100%;
		margin: 0 auto;
	}
	.selectBox{
		position: relative;
		display: block;
		width: 170px;
		height: auto;
		margin: 0 auto 10px;
	}
	._btn-short{
		width: 100%;
		margin-bottom: 10px;
	}
	.cropWrapper{
		height: 300px;
	}

	/* mylist */
	.omiaiForm_item{
		padding: 10px;
	}
	.omiaiForm_item label{
		font-size: 16px;
		font-size: 1.6rem;
	}
	._btn-middle{
		width: 100%;
		font-size: 16px;
		font-size: 1.6rem;
		line-height: 1.2em;
		white-space: normal;
		text-align: center;
	}

	iframe{
		width: 100%!important;
		height: 300px;
	}
	.content_news{
		padding-left: 0;
	}
	.content_news span{
		font-size: 18px!important;
	}
	.content_news_item{
		font-size: 16px;
		font-size: 1.6rem;
	}
	.content_news_item span{
		font-size: 12px!important;
		line-height: 1.2em;
	}
}
