@charset "UTF-8";


/*---------------------------------------------------------
FARST_BOX
---------------------------------------------------------*/

/*clear*/
	#FARST_BOX{
		zoom:1;
	}
	#FARST_BOX:before,
	#FARST_BOX:after{
		content: ".";
		display: block;
		height: 0;
		overflow: hidden;
	}
	#FARST_BOX:after{
		clear: both;
	}


/*contents*/
@media screen and (min-width:641px){
	#FARST_BOX{
		margin-bottom: 35px;
	}

	#FARST_BOX .left{
		width: 780px;
	}

.top-banner .cap{
	margin-right: 20px;
	position: relative;
}
.top-banner .cap p{
	position: absolute;
    z-index: 100;
    background: rgba(141,134,116,0.8);
    bottom: 10px;
    width: -webkit-calc(100% - 20px);
    width: clac(100% - 20px);
    padding: 20px 10px;
    color: #FFF;
}
	#FARST_BOX .right{
		width: 317px;
	}
		.slick-next{
		right: 30px !important;
	}
	.slick-prev{
		left: 0px !important;
		z-index: 100;
	}

}

@media screen and (max-width:640px){
.top-banner .cap{
	position: relative;
}
.top-banner .cap p{
	position: absolute;
	z-index: 100px;
	background: rgba(141,134,116,0.8);
	bottom:10px;
	width: 100%;
	padding: 20px 0;
	color: #FFF;
}
.top-banner .cap p span{
	margin-left: 10px;
}

.top-banner .cap img{
	width: 100%;
}
	.slick-next{
		right: 20px !important;
	}
	.slick-prev{
		left: 20px !important;
		z-index: 100;
	}
	#FARST_BOX .left{
		float: none;
	}

	#FARST_BOX .right{
		display: none;
	}
}



/*---------------------------------------------------------
SUB_BOX
---------------------------------------------------------*/
/*clear*/
	#SUB_BOX,
	#SUB_MAIN_BOX{
		zoom:1;
	}
	#SUB_BOX:before,
	#SUB_BOX:after,
	#SUB_MAIN_BOX:before,
	#SUB_MAIN_BOX:after{
		content: ".";
		display: block;
		height: 0;
		overflow: hidden;
	}
	#SUB_BOX:after,
	#SUB_MAIN_BOX:after{
		clear: both;
	}

/*contents*/
@media screen and (min-width:641px){

	#SUB_CAT{
		width: 165px;
		position: relative;
		float: left;
	}

	#SIDE_NAV_MOVE{
        width: 165px;
        box-sizing: border-box;
		background-color: #f9f6f1;
		padding: 10px 13px;
	}

	.fixed {
	  position: fixed;
	  top: 140px;
	}


	#SUB_CONT{
		width: 955px;
		float: right;
		border-left: 1px solid #f4f0e6;
		padding: 0 0 0 20px;
        box-sizing: border-box;
	}

	#SUB_MAIN_BOX{
		margin-bottom: 45px;
	}

	#SUB_MAIN_BOX #MAIN_LEFT{
		width: 595px;
		float: left;
	}

	#SUB_MAIN_BOX #MAIN_ARCHIVE_RIGHT{
		float: right;
		width: 317px;
	}

}

@media screen and (max-width:640px){
	#MAIN_LEFT{
		padding: 0 10px;
		margin-bottom: 40px;
	}

	#SUB_MAIN_BOX #MAIN_ARCHIVE_RIGHT{
		padding: 0 10px;
	}
}


/*---------------------------------------------------------
#MAIN_LEFT
---------------------------------------------------------*/
#MAIN_LEFT .box {
	zoom: 1;
}
#MAIN_LEFT .box:before,
#MAIN_LEFT .box:after {
	display: block;
	overflow: hidden;
	height: 0;
	content: ".";
}
#MAIN_LEFT .box:after {
	clear: both;
}
#MAIN_LEFT #gmo-ranking {
	margin: 25px auto 0;
}


@media screen and (min-width:641px){
	#MAIN_LEFT h1{
		border-bottom: 1px solid #3a311b;
		padding:0 0 12px 5px;
		margin-bottom: 15px;
	}
	.author #MAIN_LEFT h1{
		border-bottom: 1px solid #3a311b;
		padding:0 0 12px 5px;
		margin-bottom: 15px;
		color: #7c6c46;
        font-size: 20px;
	}

	#MAIN_LEFT h1 img{
		width: 234px;
		margin: 0;
		padding: 0;
	}

/*box*/

	#MAIN_LEFT .box{
		border-bottom: 1px solid #f3eee3;
		padding-bottom: 10px;
		margin-bottom: 10px;
	}

	#MAIN_LEFT .box h2{
		font-size: 130%;
		font-weight: normal;
		margin-bottom: 5px;
	}

	#MAIN_LEFT .box .ph{
		float: left;
		width: 157px;
	}

	#MAIN_LEFT .box .ph{
		float: left;
		width: 157px;
	}

	#MAIN_LEFT .box .box_right{
		float: right;
		width: 420px;
	}

    #MAIN_LEFT .box .box_right p {
        margin: 0 0 5px;
    }

    #MAIN_LEFT .box .box_right .author_name {
        margin: 0;
        color: #7c6c46;
        font-size: 1.3rem;
    }

    #MAIN_LEFT .box .box_right .author_name span {
        font-size: 80%;
        vertical-align: middle;
        color: #b6ac92;
    }

	#MAIN_LEFT .box .box_right .item{
		margin-top: 5px;
		color: #b6ac92;
	}

	#MAIN_LEFT .box .box_right .item a{
		color: #b6ac92;
	}


	#MAIN_LEFT .box .box_right .item_left{
		float: left;
	}
}


@media screen and (max-width:640px){
	#MAIN_LEFT h1{
		border-bottom: 1px solid #3a311b;
		padding:0 0 12px 5px;
		margin-bottom: 15px;
	}
	.author #MAIN_LEFT h1{
		border-bottom: 1px solid #3a311b;
		padding: 5px 0 5px 5px;
		margin-bottom: 15px;
		color: #7c6c46;
        font-size: 20px;
	}

	#MAIN_LEFT h1 img{
		width: 234px;
		margin: 0;
		padding: 0;
	}

/*box*/

	#MAIN_LEFT .box{
		border-bottom: 1px solid #f3eee3;
		padding-bottom: 10px;
		margin-bottom: 10px;
	}

	#MAIN_LEFT .box h2{
		font-size: 110%;
		font-weight: normal;
		margin-bottom: 5px;
	}

	#MAIN_LEFT .box .ph{
		float: left;
		width: 30%;
	}


	#MAIN_LEFT .box .box_right{
		float: right;
		width: 65%;
	}

    #MAIN_LEFT .box .box_right .author_name {
        margin: 0;
        color: #7c6c46;
        font-size: 1.1rem;
    }

    #MAIN_LEFT .box .box_right .author_name span {
        font-size: 80%;
        color: #b6ac92;
    }

	#MAIN_LEFT .box .box_right .item{
		margin-top: 5px;
		color: #b6ac92;
	}

	#MAIN_LEFT .box .box_right .item a{
		color: #b6ac92;
	}


	#MAIN_LEFT .box .box_right .item_left{
		float: left;
	}
}


/*---------------------------------------------------------
#PAGER
---------------------------------------------------------*/

	#PAGER{
		text-align: center;
		margin-top: 20px;
	}

	#PAGER .page-numbers{
		border: 1px solid #8c8267;
		padding: 5px 10px;
		font-size: 130%;
	}

	#PAGER .current{
		background-color: #3a311b;
		border: 1px solid #3a311b;
		color: #fff;
	}




/*---------------------------------------------------------
#SUB_CAT
---------------------------------------------------------*/
@media screen and (min-width:641px){
	#SUB_CAT{
		color: #3a311b;
	}


	#SUB_CAT h2{
		border-bottom: 1px solid #3a311b;
		padding-bottom: 5px;
		margin-bottom: 10px;
	}

	#SUB_CAT h2 img{
		width: 84px;
	}

	#SUB_CAT ul{
		margin: 0;
		padding: 0 0 0 16px;
	}

	#SUB_CAT li{
		list-style: disc;
	}

	#SUB_CAT a{
		color: #3a311b;
	}

	#SUB_CAT .active a{
		color: #f2c100;
	}
}


@media screen and (max-width:640px){
	#SUB_CAT{
		display: none;
	}
}




/*---------------------------------------------------------
#ACCESS_BOX
---------------------------------------------------------*/
#ACCESS_BOX .item{
	zoom:1;
}
#ACCESS_BOX .item:before,
#ACCESS_BOX .item:after{
	content: ".";
	display: block;
	height: 0;
	overflow: hidden;
}
#ACCESS_BOX .item:after{
	clear: both;
}

@media screen and (min-width:641px){
	#ACCESS_BOX{

	}

	#ACCESS_BOX h2{
		border-bottom: 1px solid #3a311b;
		padding:0 0 12px 5px;
		margin-bottom: 15px;
	}

	#ACCESS_BOX h2 img{
		width: 229px;
		margin: 0;
		padding: 0;
	}

	#ACCESS_BOX .item .item_left{
		float: left;
		width: 500px;
	}
	#ACCESS_BOX .item .item_right{
		float: right;
		width: 430px;
	}

	#map_area{
		width: 100%;
		height: 300px;
	}

	#SINGLE_ACCESS_BOX .inner .right{
		width: 100%;
	}
}

@media screen and (max-width:640px){
	#ACCESS_BOX{
		padding: 0 10px;
		margin-top: 40px;
	}

	#ACCESS_BOX h2{
		border-bottom: 1px solid #3a311b;
		padding:0 0 12px 0;
		margin-bottom: 15px;
	}


	#ACCESS_BOX h2 img{
		width: 229px;
	}

	#ACCESS_BOX .item_left{
		width: 100%;
		margin-bottom: 10px;
	}

	#map_area{
		width: 100%;
		height: 300px;
	}

	#ACCESS_BOX .inner .right{
		width: 100%;
	}
}



/*---------------------------------------------------------
THEME_BOX
---------------------------------------------------------*/
#SIDE_THEME_BOX .inner{
	zoom:1;
}
#SIDE_THEME_BOX .inner:before,
#SIDE_THEME_BOX .inner:after{
	content: ".";
	display: block;
	height: 0;
	overflow: hidden;
}
#SIDE_THEME_BOX .inner:after{
	clear: both;
}


@media screen and (min-width:641px){
	#SIDE_THEME_BOX h2{
		border-bottom: 1px solid #3a311b;
		padding:0 0 12px 5px;
		margin-bottom: 15px;
	}

	#SIDE_THEME_BOX h2 img{
		width: 304px;
	}

	#SIDE_THEME_BOX ul{
		margin: 0;
		padding: 0;
	}

	#SIDE_THEME_BOX li{
		float: left;
		margin:0 5px 15px 0;
	}

	#SIDE_THEME_BOX li a{
		background-color: #f3eee3;
		padding: 4px 10px;
		-webkit-border-radius: 2px;
		-moz-border-radius: 2px;
		border-radius: 2px;
	}

}

@media screen and (max-width:640px){
	#SIDE_THEME_BOX h2{
		border-bottom: 1px solid #3a311b;
		margin-bottom: 15px;
		padding:0 0 12px 0;
		margin-bottom: 15px;
	}

	#SIDE_THEME_BOX h2 img{
		width: 304px;
	}

	#SIDE_THEME_BOX ul{
		margin: 0;
		padding: 0;
	}

	#SIDE_THEME_BOX li{
		float: left;
		margin:0 5px 15px 0;
	}

	#SIDE_THEME_BOX li a{
		background-color: #f3eee3;
		padding: 4px 10px;
		-webkit-border-radius: 2px;
		-moz-border-radius: 2px;
		border-radius: 2px;
	}


}




/*---------------------------------------------------------
SINGLE_CAT_BOX
---------------------------------------------------------*/

#SINGLE_CAT_BOX .inner{
	zoom:1;
}
#SINGLE_CAT_BOX .inner:before,
#SINGLE_CAT_BOX .inner:after{
	content: ".";
	display: block;
	height: 0;
	overflow: hidden;
}
#SINGLE_CAT_BOX .inner:after{
	clear: both;
}


	#SINGLE_CAT_BOX li.topics a,
	#SINGLE_CAT_BOX li.topics_sapporo a{
		background-image: url(../../../common/images/wp/single/icon_top.png) !important;
		background-position: 90% center;
		background-repeat: no-repeat;
		background-size: 54px;
	}

	#SINGLE_CAT_BOX li.news a,
	#SINGLE_CAT_BOX li.news_sapporo a{
		background-image: url(../../../common/images/wp/single/icon_news.png) !important;
		background-position: 90% center;
		background-repeat: no-repeat;
		background-size: 54px;
	}

	#SINGLE_CAT_BOX li.photowedding a,
	#SINGLE_CAT_BOX li.photowedding_sapporo a{
		background-image: url(../../../common/images/wp/single/icon_photo.png) !important;
		background-position: 90% center;
		background-repeat: no-repeat;
		background-size: 54px;
	}

	#SINGLE_CAT_BOX li.style a,
	#SINGLE_CAT_BOX li.style_sapporo a{
		background-image: url(../../../common/images/wp/single/icon_style.png) !important;
		background-position: 90% center;
		background-repeat: no-repeat;
		background-size: 54px;
	}

	#SINGLE_CAT_BOX li.make a,
	#SINGLE_CAT_BOX li.make_sapporo a{
		background-image: url(../../../common/images/wp/single/icon_make.png) !important;
		background-position: 90% center;
		background-repeat: no-repeat;
		background-size: 54px;
	}

	#SINGLE_CAT_BOX li.dress a,
	#SINGLE_CAT_BOX li.dress_sapporo a{
		background-image: url(../../../common/images/wp/single/icon_dress.png) !important;
		background-position: 90% center;
		background-repeat: no-repeat;
		background-size: 54px;
	}

	#SINGLE_CAT_BOX li.wasou a,
	#SINGLE_CAT_BOX li.wasou_sapporo a{
		background-image: url(../../../common/images/wp/single/icon_wasou.png) !important;
		background-position: 90% center;
		background-repeat: no-repeat;
		background-size: 54px;
	}

	#SINGLE_CAT_BOX li.voice a,
	#SINGLE_CAT_BOX li.voice_sapporo a{
		background-image: url(../../../common/images/wp/single/icon_voice.png) !important;
		background-position: 90% center;
		background-repeat: no-repeat;
		background-size: 54px;
	}

	#SINGLE_CAT_BOX li.hairstyle a,
	#SINGLE_CAT_BOX li.hairstyle_sapporo a{
		background-image: url(../../../common/images/wp/single/icon_hairstyle.png) !important;
		background-position: 90% center;
		background-repeat: no-repeat;
		background-size: 54px;
	}

	#SINGLE_CAT_BOX li.shichigosan a,
	#SINGLE_CAT_BOX li.shichigosan_sapporo a{
		background-image: url(../../../common/images/wp/single/icon_753.png) !important;
		background-position: 90% center;
		background-repeat: no-repeat;
		background-size: 54px;
	}
    #SINGLE_CAT_BOX li.sotuhana_maedori a {
		background-image: url(../../../common/images/wp/single/icon_sotuhana.png) !important;
		background-position: 90% center;
		background-repeat: no-repeat;
		background-size: 54px;
	}
    #SINGLE_CAT_BOX li.aim-men a {
		background-image: url(../../../common/images/wp/single/icon_mens.png) !important;
		background-position: 90% center;
		background-repeat: no-repeat;
		background-size: 54px;
	}
    #SINGLE_CAT_BOX li.recruit_tokyo a,
	#SINGLE_CAT_BOX li.recruit_sapporo a{
		background-image: url(../../../common/images/wp/single/icon_recruit.png) !important;
		background-position: 90% center;
		background-repeat: no-repeat;
		background-size: 54px;
	}
    #SINGLE_CAT_BOX li.solowedding a,
	#SINGLE_CAT_BOX li.solowedding_sapporo a{
		background-image: url(../../../common/images/wp/single/icon_solo.png) !important;
		background-position: 90% center;
		background-repeat: no-repeat;
		background-size: 54px;
	}



@media screen and (max-width:640px){
	#SINGLE_CAT_BOX{
		padding: 0 10px;
		margin-top: 40px;
	}

	#SINGLE_CAT_BOX h2{
		border-bottom: 1px solid #3a311b;
		padding:0 0 12px 0;
		margin-bottom: 15px;
	}

	#SINGLE_CAT_BOX h2 img{
	width: 237px;
	}

	#SINGLE_CAT_BOX .inner_main{
		border-top: 1px solid #f3eee3;
		border-left: 1px solid #f3eee3;

	}

	#SINGLE_CAT_BOX .inner{

	}

	#SINGLE_CAT_BOX ul{
		margin: 0;
		padding: 0;
        display: flex;
        flex-wrap: wrap;
	}

		#SINGLE_CAT_BOX li {
		border-right: 1px solid #f3eee3;
		border-bottom: 1px solid #f3eee3;
		background-size: 54px;
		width: 50%;
		box-sizing: border-box;
        display: flex;
        align-items: center;
	}


	#SINGLE_CAT_BOX li a{
		display: block;
		padding: 25px 78px 25px 15px;;
        width: 100%;
	}
}

/*---------------------------------------------------------
#AUTHOR
---------------------------------------------------------*/
.page-boxbanner.author {
	display: flex;
	display: -webkit-flex;
	margin-bottom: 40px;
	-webkit-align-items: center;
	align-items: center;
	-webkit-justify-content: center;
	justify-content: center;
	background: #fcfbf9;
	padding: 20px;
}
.page-boxbanner.author > span {
	overflow: hidden;
	width: 140px;
	height: 140px;
	margin: 4px 0 0 0;
	border-radius: 50%;
}
.page-boxbanner.author > span img {
	display: block;
}
.page-boxbanner.author p {
	max-width: 650px;
	font-size: 24px;
	color: #7c6c46;
	margin: 0 0 0 15px;
}
.page-boxbanner.author p span {
	font-size: 10px;
	display: block;
	line-height: normal;
}
.author #MAIN_LEFT h1 span {
	font-size: 1.4rem;
	color: #7c6c46;
	font-weight: normal;
	vertical-align: middle;
}
@media screen and (max-width:640px){
	.page-boxbanner.author {
		margin-bottom: 0;
	}
	.page-boxbanner.author > span {
		width: 70px;
		height: 70px;
	}
	.page-boxbanner.author p {
		max-width: 70%;
		font-size: 20px;
	}
	#MAIN_LEFT h1 img {
		height: 18px;
		width: auto;
	}
}
