@charset "utf-8";
/*=============================================
		reset
==============================================*/
html, body, div, span, h1, h2, h3, h4, h5, h6, p, blockquote, a, address, img, small, strong, sup, i, dl, dt, dd, ol, ul, li{ margin: 0; padding: 0; border: 0; outline: 0; vertical-align: baseline; background: transparent; font-weight: normal; font-size: 100%; }
h1, h2, h3, h4, h5, h6, p,img,sup{line-height: 0; }
sup{position: relative;top: -0.5rem;font-size: 1rem;}
ol, ul { list-style: none; }
blockquote, q {	quotes: none; }
blockquote:before, blockquote:after,q:before, q:after { content: ''; content: none; }
table { border-collapse: collapse; border-spacing: 0; }
article, aside, footer, header, nav, section { display: block; }
*, *:before, *:after {
  -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box;
}
/*=============================================
		basic style
==============================================*/
html { font-size: 62.5%; }
body {
	font-family: "メイリオ", Meiryo, "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", sans-serif;
	color:#7e605a;
	font-size: 1.0rem;
    line-height: 1.6;
    background: #fff;
    min-width: 980px;
	-webkit-text-size-adjust: none;
}
@media screen and (max-width: 767px){
    body {
         min-width: 0;
    }
}
p{
    line-height: 2.6rem;
    font-size: 1.6rem;
}
a {
	text-decoration:none;
    color:#7e605a;
}
img{
    max-width: 100%;
    height: auto;
    vertical-align: middle;
}
input,textarea{
    vertical-align: middle;
}
/*=============================================
		common style
==============================================*/
.clearfix:after{
    content: " ";
    display: table;
    clear:both;
}
.secInner,.inner{
    width: 980px;
    margin: 0 auto;
}
.pageContents{
    width: 100%;
    margin-bottom: 80px;
}
.sp{display: none;}
.brN{display: none;}
.switch {visibility: hidden;}
.wrap {
    position: relative;
    top:92px;
    padding-bottom: 92px;
}
@media screen and (max-width: 767px){
    .wrap {
        position: relative;
        left: 0;
        overflow-x: hidden;
        top:87px;
        padding-bottom: 87px;
    }
    .pageContents,.secInner,.inner{
        width: 100%;
    }
    .pageContents{
        margin-bottom: 60px;
    }
    .inner{
        padding-left: 10px;
        padding-right: 10px;
    }
    .sp{display: block;}
    .pc{display: none;}
    .brN{display: inline;}
    .brPc{display: none;}
}
/* text */
.txtCenter{text-align: center;}
.txtRight{text-align: right;}
.fcP{color: #dd6666;}
.fRight{float: right;}
.fLeft{float:left;}
.fwB{font-weight: bold;}
.fs16{font-size:1.6rem;}
/* margin */
.mb10{ margin-bottom: 10px; }
.mb20{ margin-bottom: 20px; }
.mb25{ margin-bottom: 25px; }
.mb30{ margin-bottom: 30px; }
.mb40{ margin-bottom: 40px; }
.mb50{ margin-bottom: 50px; }
.mb60{ margin-bottom: 60px; }
.mb80{ margin-bottom: 80px; }
.mt10{ margin-top: 10px; }
.mt20{ margin-top: 20px; }
.mt25{ margin-top: 25px; }
.mt30{ margin-top: 30px; }
.mt40{ margin-top: 40px; }
.mt50{ margin-top: 50px; }
.mt60{ margin-top: 60px; }
.mt80{ margin-top: 80px; }
/*=============================================
		header
==============================================*/
.pageHeader{
    width: 100%;
    background: #fff;
    position: fixed;
    width: 100%;
    z-index: 1000;
    top:0;
}
.pageHeaderTop{
    background: url(../images/bg_pink.gif) repeat;
}
.pageHeaderTop p{
    color: #fff;
    line-height: 2.0rem;
    font-size: 1.2rem;
}
.pageHeaderCnt{
    border-bottom: 2px solid #dd6666;
}
.siteName{
    float: left;
    padding: 17px 0;
}
.siteName a{
    display: block;
}
.siteName img{
    width: 225px;
}
@media screen and (max-width: 767px){
    .pageHeaderTop p{
        font-size: 1.0rem;
        line-height: 1.6rem;
        padding: 5px 0 4px;
    }
    .siteName{
        padding: 12px 0 6px;
        width: 240px;
    }
    .siteName img{
        width: 240px;
    }
    .pageHeaderCnt .inner{
        padding-right: 0;
    }
}
/*=============================================
		navigation
==============================================*/
.globalNav{
    float: right;
}
#gNavList{
    padding: 20px 0;
}
#gNavToggle{
    display: none;
}
#gNavList li{
    display:inline-block;
    border-right: 1px solid #c1b5b2;
    width: 140px;
    text-align: center;
}
#gNavList li:first-child{
    border-left: 1px solid #c1b5b2;
}
#gNavList li a{
    display: block;
    padding: 7px 0 0;
    margin-bottom: -2px;
}
@media screen and (max-width: 767px){
    #gNavToggle{
        display: block;
        float: right;
        padding: 12px 10px 6px 10px;
        border-left: 1px solid #c1b5b2;
    }
    #gNavToggle img{
        width: 37px;
        height: 42px;
    }
    #gNavList{
        position: fixed;
        top: 87px;
        right: -300px;
        width: 300px;
        height: 100%;
        background: #7e605a;
        overflow-y: auto;
        padding: 0;
    }
    #gNavList li{
        display: block;
        border-right: 0;
        width: 100%;
        text-align: left;
    }
    #gNavList li:first-child{
        border-left: 0;
    }
    #gNavList li img{
        display: none;
    }
    #gNavList li a{
        background: #ffffee;
        border-bottom: 1px solid #ddd;
        padding: 22px 20px;
        font-size: 1.5rem;
        color: #666;
    }
    #gNavList li a:before {
        content: attr(data-label);
    }
    .slideNavHeader{
        position:fixed;
        z-index: 10;
    }
}
/*=============================================
		contents
==============================================*/
.pageCntHead{
    margin: 36px 0 25px;
}
.pageCntHead.max{
    margin-bottom: 5px;
}
.pageTitle{
    text-align: center;
}
.favoriteButton {
    position: fixed;
    bottom:0;
    right:0;
    width: 100%;
}
.favoriteButton__inner {
    max-width: 980px;
    margin-left: auto;
    margin-right: auto;
}
@media screen and (max-width: 767px){
    .pageCntHead{
        padding-left: 10px;
        padding-right: 10px;
    }
	.pageCntHead.max{
		margin-bottom: 20px;
	}
    .pageTitle img{
        width: 284px;
    }
	.pageCntHead.max .areaLogo img{
		margin-top: -15px;
	}
}
.areaName{
    float: left;
    font-size:2.4rem;
    line-height: 2.4rem;
    color: #dd6666;
    font-weight: bold;
}
.areaLogo{
    float: right;
}
.areaLogo img{
    height: 30px;
}
.pageCntHead.max .areaLogo img{
    height: 50px;
}
.subTitle{
    font-weight: bold;
    font-size: 1.8rem;
    margin-bottom: 20px;
    padding-left: 25px;
    line-height: 2.4rem;
}
.cTitle{
    font-size: 2.2rem;
    position: relative;
    line-height: 3.0rem;
    margin-bottom: 34px;
}
.cTitle br{
    display: none;
}
.rbnB{
    background: url(../images/ribbon_brown.png) no-repeat left center;
}
.rbnP{
    background: url(../images/ribbon_pink.png) no-repeat left center;
}
.rbnG{
    background: url(../images/ribbon_green.png) no-repeat left center;
}
.rbnR{
    background: url(../images/ribbon_red.png) no-repeat left center;
}
@media screen and (max-width: 767px){
    .subTitle{
        padding-left: 40px;
        min-height: 37px;
    }
    .rbnB{
        background: url(../images/ribbon_brown_sp.png) no-repeat left center;
        background-size: 30px 37px;
    }
    .rbnP{
        background: url(../images/ribbon_pink_sp.png) no-repeat left center;
        background-size: 30px 37px;
    }
    .rbnG{
        background: url(../images/ribbon_green_sp.png) no-repeat left top;
        background-size: 30px 37px;
    }
    .cTitle{
        font-size: 2.0rem;
        line-height: 2.3rem;
        margin-bottom: 23px;
    }
    .cTitle br{
        display: inline;
    }
    .mainCntsArea .subTitle.rbnP{
        background: url(../images/ribbon_pink_sp.png) no-repeat left 3px;
        background-size: 30px 37px;
    }
}
.mainCntsArea{
    background: url(../images/bg_gray.gif) repeat;
    border: 1px solid #ddd;
    padding: 20px 18px 0;
}
.mainCntsArea .imgArea img{
    border-radius: 10px;
}
.mainCntsArea.btmR,#tabCnt2 .mainCntsArea,#tabCnt3 .mainCntsArea{
    border-bottom-left-radius: 10px;
    border-bottom-right-radius: 10px;
}
.mainCntsArea.btmR{
    margin-bottom: 80px;
}
@media screen and (max-width: 767px){
    .mainCntsArea{
        padding-left: 10px;
        padding-right: 10px;
    }
    .mainCntsArea.btmR,#tabCnt2 .mainCntsArea,#tabCnt3 .mainCntsArea{
        border-radius: 0;
    }
	.mainCntsArea.btmR{
    	margin-bottom: 0;
	}
}

.pageCntSns {
    padding-bottom: 25px;
}

.linkSns {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    flex-wrap: wrap;
    -webkit-justify-content: flex-end;     /* Safari etc. */
    -ms-justify-content: flex-end;     /* IE10        */
    justify-content: flex-end;
    padding-left: 5px;
    padding-right: 5px;
}
.linkSns > li {
    padding-left: 5px;
    padding-right: 5px;

}
    /*=============================================
        link Btn
    ==============================================*/
.linkArrow{
    background:url("../images/arrowRight_p.png") no-repeat #fff;
    background-size: 18px 18px;
    background-position: 98% center;
    border-radius: 10px;
    color: #dd6666;
    font-size: 1.8rem;
    line-height: 2.4rem;
    border: 1px solid #dd6666;
    text-align: center;
    padding: 22px 0 ;
    display: block;
}
.linkArrow:hover{
    background:url("../images/arrow_w.png") no-repeat #dd6666;
    background-position: 98% center;
    color: #fff;
}
.linkArrow br{
    display: none;
}
.linkBlank{
    background: url(../images/icon_blank.png) no-repeat right center;
    background-size: 14px 14px;
    padding-right: 20px;
}
a.linkBlank:hover{
    text-decoration: underline;
}
@media screen and (max-width: 767px){
    .linkArrow{
        font-size: 1.4rem;
        line-height: 1.8rem;
        padding: 10px 0 9px;
        background-size: 13px 13px;
    }
    .linkArrow br{
        display: inline;
    }
    .linkArrow .spFs{
        font-size: 2.0rem;
    }
}
/*=============================================
		link to entry input
==============================================*/
.linkEntry{
    background: #dd2288;
    background: url(../images/free_w.png) no-repeat 90px center #dd2288;
    border-radius: 10px;
    color: #fff;
    font-size: 1.4rem;
    line-height: 2rem;
    border: 1px solid #dd2288;
    text-align: center;
    padding: 20px 0 20px 60px;
    width: 440px;
    margin: 0 auto;
    display: block;
}
.buttonFavorite {
    border-radius: 10px;
    color: #7e605a;
    font-size: 1.2rem;
    line-height: 2rem;
    border: 1px solid #7e605a;
    text-align: center;
    padding: 20px 0;
    margin: 0 auto;
    display: block;
    cursor: pointer;
    width: auto;
    background-color: #fff;
    max-width: 200px;
    width: 100%;
}

.buttonFavorite:hover {
    background-color: #7e605a;
    color: #fff;
}
@media screen and (min-width: 768px){
    .buttonFavorite {
        background-image: url(../images/heart_w.png);
        background-repeat: no-repeat;
        background-position: 50px center;
        -webkit-background-size: 31px auto;
        background-size: 31px auto;
        padding: 33px 0 33px 40px;
        width: 300px;
        font-size: 2.0rem;
        line-height: 2.6rem;
        max-width: none;
    }
    .buttonFavorite.is_active {
        background-image: url(../images/heart_delete_w.png);
        background-position: 40px center;
    }


}
.pageDL .linkEntry.w300{
    width: 300px;
    font-size: 1.6rem;
    line-height: 2.0rem;
    background: url(../images/free_w.png) no-repeat 24px center #dd2288;
    background-size: 41px 35px;
    padding: 10px 0 10px 30px;
}
.pageDL .linkEntry{
    background: url(../images/free_w.png) no-repeat 75px center #dd2288;
}
.linkInput {
    width:520px;
	display:block;
	margin:0 auto;
}
.linkInput input[type="submit"]{
    background: url(../images/btn_entry_of_pc.png) no-repeat ;
	text-indent:-9999px;
	width:520px;
	height:90px;
	border:none;
}
@media screen and (min-width: 768px){
    .linkEntry {
        font-size: 2.0rem;
        line-height: 2.6rem;

    }
    .linkEntry:hover{
        color: #dd2288;
        background: url(../images/free_p.png) no-repeat 90px center #fff;
    }
    .pageDL .linkEntry:hover{
        background: url(../images/free_p.png) no-repeat 75px center #fff;
    }
    .kyotoItem a:hover .linkEntry.w300,
    .pageDL .linkEntry.w300:hover{
        color: #dd2288;
        background: url(../images/free_p.png) no-repeat 24px center #fff;
        background-size: 41px 35px;
    }
	.linkInput input[type="submit"]:hover{
		background: url(../images/btn_entry_on_pc.png) no-repeat ;
		text-indent:-9999px;
		cursor: pointer;
	}
}
@media screen and (max-width: 767px){
    .pageDL .linkEntry.w300,
    .linkEntry,.linkInput input[type="submit"]{
        background: url(../images/free_w_sp.png) no-repeat 10px center #dd2288;
        width: 100%;
        padding: 10px 5px 10px 30px;
        font-size: 1.2rem;
        line-height: 2rem;
        background-size: 25px auto;
        max-width: 300px;
        width: 100%;
    }
    .pageDL .linkEntry{
        background: url(../images/free_w_sp.png) no-repeat 10px center #dd2288;
        background-size: 41px 35px;
    }
	.linkInput {
		width:300px;
	}
    .linkInput input[type="submit"]{
		background: url(../images/btn_entry_sp.png) no-repeat ;
		background-size:300px 70px;
		text-indent:-9999px;
		width:300px;
		height:70px;
	}
}
/*====================
		link other
======================*/
.mainCntsArea .toEntry{
    position: fixed;
    width: 100%;
    bottom: 0;
    left: 0;
    z-index: 100;
    background-color: #fff;
    padding: 15px;
    margin-bottom: 0;
}
.toEntry__list {
    display: -ms-flexbox; /* IE10 */
    display: -webkit-box; /* Android4.3以下、Safari3.1〜6.0 */
    display: -webkit-flex; /* Safari6.1以降 */
    justify-content: center;
    -ms-flex-pack: center; /*IE10*/
    -webkit-box-pack: center; /* Android4.3以下、Safari3.1〜6.0 */
    -webkit-justify-content: center; /* Safari6.1以降 */
    margin-left: -10px;
    margin-right: -10px;
}
.toEntry__list > li {
     padding-left: 10px;
     padding-right: 10px;
 }
.toEntry__list > li:last-child {
    padding-left: 10px;
    padding-right: 10px;

}
@media screen and (max-width: 768px){
    .mainCntsArea .toEntry{
        padding: 15px 10px;
    }
    .toEntry__list {
        margin-left: -5px;
        margin-right: -5px;
    }
    .toEntry__list > li {
        padding-left: 5px;
        padding-right: 5px;
        width: 40%;
    }
    .toEntry__list > li:last-child {
        padding-left: 5px;
        padding-right: 5px;
        width: 60%;
    }
}
.mainCntsArea .iconS {
    position: static;
    height: auto;
}
.linkTxt{
    background: url(../images/arrowRight_p.png) no-repeat;
    background-size: 18px 18px;
    background-position: 96% center;
    padding-right: 28px;
    display: inline-block;
}
.linkBack .linkTxt{
    background: url(../images/arrowLeft.png) no-repeat;
    background-size: 18px 18px;
    background-position:left center;
    padding:0 0 0 28px;
}
@media screen and (min-width: 768px){
    .linkTxt:hover{
        text-decoration: underline;
    }
}
/*=============================================
		link Area
==============================================*/
.linkArea{
    text-align: center;
    line-height: 0;
}
.links{
    display: inline-block;
}
.links li{
    width: 400px;
    margin-right: 20px;
    float: left;
}
.links li:last-child{
    margin-right: 0;
}
@media screen and (max-width: 767px){
    .linkArea{
        padding-left: 10px;
        padding-right: 10px;
    }
    .links{
        width: 100%;
    }
    .links li{
        margin-bottom: 10px;
        margin-right:0;
        width: 100%;
    }
    .links li:last-child{
        margin-bottom: 0;
    }
}
/*=============================================
		icon list
==============================================*/
.iconS{
    height: 34px;
    position: absolute;
    top:0;
    left:10px;
    width : 98%;
    width : -webkit-calc(100% - 20px) ;
    width : calc(100% - 20px) ;
}
.iconS li,.iconS p{
    font-size: 1.2rem;
    line-height: 34px;
    display: inline-block;
    margin-right: 5px;
}
.iconS li:last-child{
    margin-right: 0;
}
.iconS li img{
    width: 34px;
    height: 34px;
    vertical-align: top;
}
.iconL{
    font-size: 1.8rem;
    font-weight: bold;
    line-height: 4.4rem;
}
.iconPresent{
    background: url(../images/icon_present.png) no-repeat left center;
}
.iconL.iconPresent{
    background-size: 44px 44px;
    padding-left: 54px;
    margin-bottom: 16px;
}
.iconS .iconPresent{
    background-size: 34px 34px;
    padding-left: 40px;
}
@media screen and (max-width: 767px){
    .iconS li img{
        width: 24px;
        height: 24px;
        vertical-align: top;
    }
    .iconS .iconPresent{
        background-size: 24px 24px;
        padding-left: 30px;
    }
    .iconS li,.iconS p{
        font-size: 1.2rem;
        line-height: 2.4rem;
    }
    .iconL.iconPresent{
        margin-bottom: 24px;
    }
}
/*=============================================
		images
==============================================*/
.slides li a,.catItem a,.rankList li a{
    display: block;
    line-height: 0;
}
.name{
    font-size: 1.8rem;
    font-weight: bold;
    line-height: 2.4rem;
    margin-bottom: 3px;
    text-align: center;
}
.summary{
    line-height: 2.0rem;
    font-size: 1.6rem;
    text-align: center;
}
.catItem .summary,.rankList .summary{
    font-size: 1.4rem;
    line-height: 1.8rem;
    margin-bottom: 18px;
}
.bdrImg{
    position: relative;
    display:block;
}
.slides li .bdrImg{
    margin-bottom: 8px;
}
.catItem .bdrImg,.rankList .bdrImg{
    margin-bottom: 18px;
}
.rankListSlides .rankList .bdrImg{
    margin-bottom: 10px;
}
.bdrImg:before{
    content: "";
    position: absolute;
    top: 0;bottom: 0;left: 0;right: 0;
    box-shadow: inset 0 0 0 1px #ddd;
}
.slides li a:hover span.bdrImg:before,
.catItem a:hover span.bdrImg:before,
.catItem.catHover span.bdrImg:before,
.kyotoItem a:hover span.bdrImg:before,
.imgbox:hover span.bdrImg:before,
.rankList > li a:hover span.bdrImg:before{
    box-shadow: inset 0 0 0 3px #dd6666;
}
.bdrR img,.bdrImg.bdrR:before{
    border-radius: 10px;
}
@media screen and (max-width: 767px){
    .summary,.catItem .summary,.rankList .summary{
        line-height: 2.0rem;
        font-size: 1.5rem;
    }
    .catItem .name{
        line-height: 2.1rem;
    }
    .rankList .name,
    .rankList .summary{
        margin-bottom: 0;
    }
    .slides .name{
        margin-bottom: 10px;
    }
    .slides li .bdrImg{
        margin-bottom: 14px;
    }
    .catItem .bdrImg,.rankList .bdrImg{
        margin-left: 0;
        margin-right: 0;
    }
}

.designArea .catItem {
    display: none;
}
.designArea .catItem.is_show {
    display: block;
}
/*=============================================
		top main visual
==============================================*/
.mv{
    background: url(../images/bg_mv_pc.jpg) no-repeat top center;
    background-size: cover;
    position: relative;
    padding-top: 10px;
    padding-bottom: 40px;
    min-height: 590px;
}
.snsList{
    text-align: right;
}
.snsList li{
    display: inline-block;
    vertical-align: top;
    margin-left: 10px;
}
.snsList li:first-child{
    margin-left: 0;
}
.copyImg{
    text-align: right;
    margin-top: 14px;
}
.copyImg img{
    width: 150px;
    height: 150px;
}
@media screen and (max-width: 767px){
    .mv{
        background: url(../images/bg_mv_sp.jpg) no-repeat top center;
        background-size: 100% auto;
        padding-bottom: 0;
        min-height:0;
    }
    .snsList{
        text-align: left;
        float: left;
    }
    .copyImg{
        float: right;
        margin-top: 0;
        margin-right: -6px;
    }
    .copyImg img{
        width: 97px;
        height: 97px;
    }
}
.mvText {
    width: 490px;
}

@media screen and (min-width: 768px){
    .mvText {
        padding-top: 90px;
    }
}
.mvText .pageTitle{
    text-align: left;
    margin-bottom: 10px;
}
.mvSiteName{
    text-align: center;
    margin-bottom: 20px;
}
.mvSiteName img{
    width: 162px;
}
.featuredList{
    text-align: center;
    margin-bottom: 40px;
}
.featuredList li{
    display: inline-block;
    margin-right: 5px;
}
.featuredList li:last-child{
    margin-right: 0;
}
.featuredList li img{
    width: 110px;
    height: 110px;
}
.toConcept{
    text-align: center;
    margin-bottom: 70px;
}
.attention{
    font-size: 1.0rem;
    line-height: 1.4rem;
}
.mv .attention{
    color: #555;
    text-indent: -1.7rem;
    margin-left: 3rem;
    font-size: 1.3rem;
    line-height: 1.7rem;
    margin-bottom: 20px;
}
.mv .red{
    color: red;
}
.mv .red a{
    color: red;
    text-decoration: underline;
}
@media screen and (max-width: 767px){
    .mvText {
        width: 100%;
        margin-top:70%;
        margin-bottom: 40px;
    }
    .mvText .pageTitle{
        text-align: center;
        margin-bottom: 5px;
    }
    .mvText .pageTitle img{
        width: 280px;
    }
    .mvSiteName{
        margin-bottom: 15px;
    }
    .mvSiteName img{
        width: 114px;
    }
    .featuredList{
        margin-bottom: 15px;
    }
    .featuredList li{
        margin-right: 3px;
    }
    .featuredList li img{
        width: 72px;
        height: 72px;
    }
    .toConcept{
        margin-bottom: 15px;
    }
}
.secArea{
    width: 980px;
    margin: 20px auto 70px;
    border: 1px solid #ddd;
    background: url(../images/bg_dot.png) repeat left top;
    padding: 40px 60px 70px;
    border-radius: 10px;
    position: relative;
}
.secArea .pageTitle{
    margin-bottom: 60px;
}
.secArea .mapColumn{
    position: absolute;
    top:-20px;
    right: 50px;
    padding: 0;
}
.secRank {
    width: 980px;
    margin: 20px auto 70px;
    border: 1px solid #ddd;
    background: url(../images/bg_dot.png) repeat left top;
    padding: 40px 19px 70px;
    border-radius: 10px;
    position: relative;
}
.secRank .pageTitle {
    margin-bottom: 20px;
}
.secRank .pageTitle img {
    width: 184px;
}
.secDesign{
    width: 980px;
    margin: 0 auto 60px;
    border-radius: 10px;
    border: 1px solid #ddd;
    background: url(../images/bg_gray.gif) repeat left top;
    padding: 40px 19px;
}
.secDesign .pageTitle{
    margin-bottom: 20px;
}
.secDesign .pageTitle img {
    width: 131px;
}
.secDesign .linkArea{
    width: 440px;
    margin: 0 auto;
}
.secNews,.secBanner{
    width: 980px;
    margin: 0 auto 60px;
    position: relative;
}
.toNews{
    position: absolute;
    right: 10px;
    top: 5px;
    font-size: 1.4rem;
    line-height: 2.4rem;
}
.newsList{
    border-top:1px solid #ddd;
    width: 100%;
}
.newsList li{
    border-bottom:1px solid #ddd;
    width: 100%;
    padding: 0 10px 0 54px;
    font-size: 1.4rem;
    line-height: 5.0rem;
}
.newsList li a:hover{
    text-decoration: underline;
}
.newsList li.new{
    background: url(../images/icon_new.png) no-repeat 10px 8px;
    background-size: 34px 34px;
}
.topBnrList li{
    display: inline-block;
    margin-bottom: 20px;
}
.topBnrList li:nth-child(odd){
    margin-right: 20px;
}
.topBnrList li:nth-last-child(-n+2){
    margin-bottom: 0;
}
.topBnrList li a{
    display: block;
}
.topBnrList li a:hover{
    opacity: .8;
}
.topBnrList li img{
    width: 480px;
    height: 160px;
}
@media screen and (max-width: 767px){
    .secArea,.secDesign,.secBanner,.secRank{
        width: 100%;
        padding-left: 10px;
        padding-right: 10px;
    }

    .secArea,
    .secRank{
        border-radius: 0;
        background: url(../images/bg_gray.gif) repeat left top;
        margin-bottom: 0;
        margin-top: 0;
        padding-bottom: 40px;
        border-bottom: 0;
    }
    .secDesign{
        border-radius: 0;
        margin-bottom: 40px;
    }
    .secArea .pageTitle,.secDesign .pageTitle{
        margin-bottom: 30px;
    }
    .secDesign .pageTitle img{
        width: 131px;
    }
    .secDesign .catItem:last-child {
        margin-bottom: 40px;
    }
    .secDesign .linkArea{
        width: 100%;
        padding: 0;
    }
    .topBnrList li,
    .topBnrList li:nth-last-child(2){
        margin-bottom: 10px;
    }
    .topBnrList li:nth-child(odd){
        margin-right: 0;
    }
    .topBnrList li img{
        width: 100%;
        height: auto;
    }
}
/*=============================================
		tabs
==============================================*/
.tabs{
    display: table;
}
.tabs li {
    display: table-cell;
    word-wrap: break-word;
    width:205px;
}
.tabs li a {
    font-size: 1.8rem;
    display: block;
    text-align: center;
    padding: 13px 0 19px;
    color: #fff;
    border-radius: 10px 10px 0 0 ;
    line-height: 1;
    margin-right: 5px;
}
.tabs li:last-child a{
    margin-right: 0;
}
.tabs li a br{
    display: none;
}
@media screen and (max-width: 767px){
    .tabs{
        width: 100%;
    }
    .tabs li a{
        margin-right: 1.8%;
        font-size: 1.5rem;
        padding: 9px 0 17px;
        line-height: 1.7rem;
    }
    .tabs li a br{
        display: inline;
    }
}
.tabPanel{
    position: relative;
}
.tabPanel:before{
    position: absolute;
    content:"";
    border-radius: 0 10px 0 0;
    left: 0;
    top:-10px;
    height: 10px;
    width: 100%;
}
.tabPanels > .tabPanel {
    display: none;
}
.tabPanels > .tabPanel.active {
    display: block;
}
@media screen and (max-width: 767px){
    .tabPanel:before{
        border-radius: 0;
    }
}
/*==============
    tab btn
==============*/
#tabBtn1 a,#tabCnt1:before{
    background: url(../images/bg_pink.gif) repeat;
}
#tabBtn2 a,#tabCnt2:before{
    background: url(../images/bg_green.gif) repeat;
}
#tabBtn3 a,#tabCnt3:before{
    background: url(../images/bg_red.gif) repeat;
}
/*=============================================
		tab gallery
==============================================*/
.galleryArea{
    margin-bottom: 40px;
}
.gallerySide{
    float: right;
}
.thumbs li{
	width:220px;
	margin:0 0 20px 0;
    text-align: center;
}
.thumbs li span{
    position: relative;
    display:block;
}
.thumbs li span img{
    width: 220px;
    height: 154px;
}
.thumbs li span:hover{
    cursor: pointer;
}
.thumbs li span:before{
    content: "";
    position: absolute;
    top: 0;bottom: 0;left: 0;right: 0;
    box-shadow: inset 0 0 0 1px #ddd;
}
.thumbs li span.current:before{
    box-shadow: inset 0 0 0 4px #dd6666;
    background-color: rgba(217,100,100,.2);
}
.thumbs li span.current:after{
    content: "";
    position: absolute;
    top:70px;
    right: 100%;
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 7.5px 10px 7.5px 0;
    border-color: transparent #dd6666 transparent transparent;
}
p.thumbsInfo{
    font-size: 1.4rem;
    line-height: 20px;
    background: url(../images/icon_glass.png) no-repeat left center;
    padding-left: 30px;
}
.galleryMain{
    width: 700px;
    float: left;
    position: relative;
}
@media screen and (max-width: 767px){
    .galleryArea{
        margin-bottom: 0;
    }
    .gallerySide{
        float: none;
    }
    p.thumbsInfo,.galleryMain{
        display: none;
    }
    .thumbs li{
        width:100%;
    }
    .thumbs li span img{
        width:100%;
        height: auto;
    }
    .thumbs li span:hover{
        cursor:default;
    }
    .thumbs li p{
        margin-bottom: 10px;
    }
}
.galleryMain:before{
    content: "";
    position: absolute;
    top: 0;bottom: 0;left: 0;right: 0;
    box-shadow: inset 0 0 0 1px #ddd;
    z-index: 4;
}
.galleryMain img{
    position: absolute;
    height: auto;
}
/*=============================================
		tab panel1 sp Area
==============================================*/
.spArea{
    border-bottom: 1px solid #ddd;
    border-left: 1px solid #ddd;
    border-right: 1px solid #ddd;
    border-radius: 0 0 10px 10px;
    background: url(../images/bg_yellow.gif) repeat;
    padding: 40px 20px 20px;
    margin-bottom: 80px;
}
.spTitle{
    font-size: 2.6rem;
    color: #dd6666;
    line-height: 3.4rem;
    margin-bottom: 11px;
}
.spTxt{
    margin-bottom: 32px;
}
.spArea .subTitle{
    margin-bottom: 11px;
}
.spDetail{
    margin-bottom: 20px;
}
.spDetailttl{
    font-weight: bold;
    margin-bottom: 6px;
    font-size: 1.6rem;
    line-height: 2.4rem;
}
@media screen and (max-width: 767px){
    .spArea{
        padding-left: 10px;
        padding-right: 10px;
        border-radius: 0;
        margin-bottom: 0;
    }
    .spTitle{
        font-size: 2.3rem;
        line-height: 3.2rem;
        margin-bottom: 10px;
    }
    .spTxt{
        margin-bottom: 25px;
    }
    .spArea .subTitle{
        margin-bottom: 16px;
        padding-top: 6px;
    }
}
.spList{
    border: 1px solid #ddd;
    border-radius: 10px;
    width: 100%;
    border-collapse: separate;
}
.spList th{
    background: url(../images/bg_brown.gif) repeat;
    vertical-align:top;
    color: #fff;
    text-align: left;
    border-right: 1px solid #ddd;
    width: 140px;
    font-weight: normal;
}
.spList td{
    background: #fff;
}
.spList th,.spList td{
    border-bottom: 1px solid #ddd;
    padding: 8px 20px;
    font-size: 1.4rem;
}
.spList tr:last-child th,.spList tr:last-child td{
    border-bottom: none;
}
.spList tr:first-child th:first-child{
    border-radius: 10px 0 0 0;
}
.spList tr:first-child td:last-child{
    border-radius: 0 10px 0 0;
}
.spList tr:last-child th:first-child{
  border-radius: 0 0 0 10px;
}
.spList tr:last-child td:last-child{
    border-radius: 0 0 10px 0;
}
.spList.listLine1 tr:first-child th{
    border-radius: 10px 0 0 10px;
}
.spList.listLine1 tr:last-child td:last-child {
    border-radius: 0 10px 10px 0;
}
@media screen and (max-width: 767px){
    .spList a{
        text-decoration:underline;
        color: #dd6666;
    }
    .spList th{
        width: 27.8%;
        padding-left: 2.8%;
        padding-right: 2.8%;
        letter-spacing: -0.1rem;
    }
    .spList td{
        padding-left: 2.8%;
        padding-right: 2.8%;
    }
}
/*=============================================
		recommend Area
==============================================*/
.rcmndArea{
    border: 2px solid #dd6666;
    border-radius: 10px;
    padding: 40px 0;
    text-align: center;
    margin-bottom: 60px;
    background: #fff;
    position: relative;
}
.rcmndTitle:before{
    content:url(../images/ribbon_en.png);
    top: -85px;
    left: 46%;
    position: absolute;
    -webkit-transform: scale(0.5);
    -moz-transform: scale(0.5);
    transform: scale(0.5);
}
.rcmndTitle br{
        display: none;
}
.pageAbout .rcmndAreaWrap,
.pageNews .rcmndAreaWrap{
    width: 980px;
    margin-left: auto;
    margin-right: auto;
}
.pageAbout .rcmndArea,
.pageDesign .rcmndArea,
.pageArea .rcmndArea{
    margin-bottom: 40px;
}
@media screen and (max-width: 767px){
    .rcmndAreaWrap{
        padding: 62px 0 0;
        border-bottom: 1px solid #ddd;
        border-left: 1px solid #ddd;
        border-right: 1px solid #ddd;
        background: url(../images/bg_gray.gif) repeat;
        margin-bottom: 40px;
    }
    .pageAbout .rcmndAreaWrap,
    .pageNews .rcmndAreaWrap{
        width: 100%;
        padding: 0;
        border: 0;
        background: transparent;
        margin: 0;
    }
    .rcmndArea{
        padding: 24px 0 20px;
        margin-left: 10px;
        margin-right: 10px;
        margin-bottom: 40px;
    }
    .rcmndTitle:before{
        top: -68px;
        left: 44%;
    }
    .rcmndTitle br{
        display: inline;
    }
    .cTitle.rcmndTitle{
        margin-bottom: 15px;
    }
}
@media screen and (max-width: 480px){
    .rcmndTitle:before{
        left: 40%;
    }
}
/*=============================================
		slider
==============================================*/
.slides{
    padding: 0 128px;
    border: none;
    margin-bottom: 0;
}
.slides li a{
    margin-left: 10px;
    margin-right: 10px;
}
.slick-arrow{
    position: absolute;
    top: 50%;
    width: 38px;
    height: 80px;
    margin-top: -78px;
    cursor: pointer;
}
.slideNext{
    right: 0;
}
.slidePrev{
    left: 0;
}
@media screen and (min-width: 768px){
    .slick-arrow:hover{
        opacity: .8;
    }
}
@media screen and (max-width: 767px){
    .slides{
        padding: 0 64px;
    }
    .slides li a{
        margin: 0;
    }
}
/*=============================================
		tab panel2
==============================================*/
.tab2Block{
    margin-bottom: 80px;
}
.imgArea{
    width: 940px;
    height: 400px;
    margin-bottom: 34px;
}
.imgTxt{
    font-weight:bold;
    font-size: 2.4rem;
    line-height: 3.4rem;
	letter-spacing:-0.06rem;
	margin-bottom: 34px;
}
.imgTxt br{
	display:none;
}
.imgTxt br.pc{
	display:inline;
}
@media screen and (max-width: 767px){
    .tab2Block{
        margin-bottom: 30px;
    }
    .imgArea{
        width: 300px;
        height: 200px;
        margin: 0 auto 20px;
    }
    .imgTxt{
        font-size: 2.0rem;
        line-height: 24px;
		margin-bottom:20px;
    }
	.imgTxt br{
		display:inline;
	}
}
.normalListG > li{
    margin: 0 0 20px 0;
    font-size:1.6rem;
    line-height: 2.5rem;
    padding-left: 1em;
    text-indent: -1em;
}
.normalListG > li:before{
    content:"";
    border-left: 6px solid #28a6c1;
    margin-right: 10px;
    padding: 2px 0;
}
.labelList{
    margin-top: -2px;
}
.labelList > li{
    margin: 0 0 15px 0;
    font-size:1.6rem;
    line-height: 2.6rem;
    letter-spacing: -0.02rem;
    position: relative;
    padding-top: 25px;
}
.labelList > li:before{
    position: absolute;
    left: -3rem;
    top: -1rem;
    -webkit-transform: scale(0.5);
    -moz-transform: scale(0.5);
    transform: scale(0.5);
}
.labelList > li.kids:before{
    content:url(../images/label_kids.png);
}
.labelList > li.other:before{
    content:url(../images/label_other.png);
}
.labelList > li.work:before{
    content:url(../images/label_work.png);
}
.labelList > li.culture:before{
    content:url(../images/label_culture.png);
}
.labelList > li.marriage:before{
    content:url(../images/label_marriage.png);
}
.labelList > li.life:before{
    content:url(../images/label_life.png);
}
.labelList > li.env:before{
    content:url(../images/label_env.png);
}
.labelList > li.history:before{
    content:url(../images/label_history.png);
}
.labelList > li.moving:before{
    content:url(../images/label_moving.png);
}
.labelList > li.parenting:before{
    content:url(../images/label_parenting.png);
    left: -6.5rem;
}
.normalListG > li:last-child,
.labelList > li:last-child{
    margin-bottom: 0;
}
@media screen and (max-width: 767px){
    .normalListG > li{
        margin: 0 0 20px 0;
        padding-left: 0;
        text-indent: 0;
    }
    .normalListG > li:before{
        border-left:0;
        margin-right: 0;
    }
    .normalListG > li:last-child{
        margin-bottom: 25px;
    }
    .labelList{
        margin-top: 0;
    }
}
.columnL{
    float: left;
    width: 460px;
}
.columnR{
    float: right;
    width: 460px;
}
.column2{
    float: left;
    width: 460px;
    padding-left: 20px;
}
.imgCol1,imgCol2{
    margin-bottom: 20px;
}
.imgCol1 img,.imgCol2 img{
    border-radius: 10px;
}
.imgCol2 div{
    width: 222px;
}
@media screen and (max-width: 767px){
    .columnL,.columnR,.column2{
        float:none;
        width: 100%;
    }
    .imgColWrap{
        max-width: 600px;
        margin: 0 auto 20px;
    }
    .column2{
        padding-left: 0;
    }
    .imgCol1,.imgCol2{
        margin-bottom: 10px;
    }
    .imgCol2 div{
        width: 48.3%;
    }
}
.birthInfo{
    border: 1px solid #ddd;
    border-radius: 10px;
    padding: 30px 20px 20px 0;
    background: #fff;
    position: relative;
    margin-bottom: 60px;
}
.birthInfo p{
    font-size: 1.4rem;
}
.birthImg{
    width: 296px;
}
.birthInfoLead{
    font-size: 1.8rem;
    color: #dd6666;
    font-weight: bold;
    margin-bottom: 12px;
    letter-spacing: -0.02rem;
    line-height: 2.4rem;
}
.birthInfo p.more{
    text-align: right;
    position: absolute;
    bottom: 15px;
    right: 25px;
    font-size: 1.4rem;
}
.birthInfo p.more a:hover{
    text-decoration: underline;
}
.birthInfo p.more a{
    background: url("../images/arrowRight_p.png") no-repeat;
    background-size: 18px 18px;
    background-position: 96% center;
    padding-right: 28px;
    display: block;
}
@media screen and (max-width: 767px){
    .birthInfo{
        padding-left: 15px;
        padding-right: 15px;
        padding-bottom: 5px;
        margin-bottom: 30px;
    }
    .birthImg{
        width: 270px;
        margin-bottom: 20px;
    }
    .birthInfo p{
        font-size: 1.6rem;
        margin-bottom: 30px;
    }
    .birthInfo p.more{
        text-align: center;
        position: relative;
        right: auto;
        font-size: 1.6rem;
        margin-bottom: 0;
    }
    .birthInfo p.more a{
        background-size: 13px 13px;
        padding-right: 23px;
        display: inline;
    }
}
/*=============================================
		tab panel3
==============================================*/
.normalListR > li{
    margin: 0 0 20px 0;
    font-size:1.6rem;
    line-height: 2.6rem;
    padding-left: 1em;
    text-indent: -1em;
    letter-spacing: -0.02rem;
}
.normalListR > li:before{
    content:"";
    border-left: 6px solid #ce0202;
    margin-right: 10px;
}
/*=============================================
		map area
==============================================*/
.mapArea{
    border: 1px solid #ddd;
    background: url(../images/bg_dot.png) repeat left top;
    padding: 40px 20px;
    border-radius: 10px;
}
@media screen and (max-width: 767px){
    .mapArea{
        border:0;
        padding: 0;
        border-radius: 10px;
        background: none;
    }
}
.mapColumn{
    float: left;
    width:387px;
    padding: 38px 20px 0 10px;
}
.areaColumnWrap{
    width: 550px;
    float: right;
    display: table;
    table-layout: fixed;
}
.areaColumn{
    display: table-cell;
    border-left: 1px solid #ddd;
    padding-left: 19px;
    width: 183px;
}
.areaColumnHead{
    font-size: 1.6rem;
    margin-bottom: 10px;
    line-height: 1.6rem;
}
.areaColumnHead a{
    font-weight: bold;
}
.areaCol1,.areaCol2{
    font-size: 1.4rem;
}
.areaCol1 a,.areaCol2 a{
    position: relative;
    display: inline-block;
    padding-left: 1rem;
    margin-bottom: 2px;
}
.areaCol1 a:before,.areaCol2 a:before{
    content: "･";
    position: absolute;
    top: 0;
    left: 0;
}
.areaColBtm{
    margin-bottom: 30px;
}
.areaColumn a:hover{
    text-decoration: underline;
}
@media screen and (max-width: 767px){
    .areaList{
        width: 100%;
        padding-left: 10px;
        padding-right: 10px;
    }
    .secArea .areaList{
        padding-left: 0;
        padding-right: 0;
    }
    .areaListTitle,.accordionClose{
        font-size: 1.5rem;
        color: #fff;
        text-align: center;
        padding: 18px 0;
        line-height: 2.2rem;
        background: url(../images/bg_brown.gif) repeat;
    }
    .areaListTitle{
        border-top-left-radius: 10px;
        border-top-right-radius: 10px;
    }
    .areaListTitle .accordionBtn,.accordionClose .accordionBtn{
        background: url(../images/icon_plus.png) no-repeat;
        background-position: 96% center;
        background-size: 13px 13px;
        display: block;
    }
    .areaListTitle .accordionBtn.open,.accordionClose .accordionBtn{
        background-image: url(../images/icon_minus.png);
        background-size: 13px 1px;
    }
    .accordionClose{
        border-bottom-left-radius: 10px;
        border-bottom-right-radius: 10px;
    }
    .areaColumnWrap{
        border-top:1px solid #ccc;
        width: 100%;
        float: none;
        display: block;
    }
    .areaColumn{
        display: block;
        width: 100%;
        padding-left:0;
        border-right:1px solid #ccc;
    }
    .areaColumnHead{
        font-size: 1.5rem;
        margin-bottom: 0;
        line-height: 1.5rem;
    }
    .areaColumnHead a{
        padding: 18px 10px;
        display: block;
        background: url("../images/arrow_down.png") no-repeat #fdfde3;
        background-size: 13px 7px;
        background-position: 98% center;
        border-bottom: 1px solid #ccc;
        color: #666;
    }
    .secArea .areaColumnHead a{
        background: url("../images/arrowRight_p.png") no-repeat #fdfde3;
        background-size: 13px 13px;
        background-position: 98% center;
    }
    .areaCol1,.areaCol2{
        margin-left: 0;
        background: #ffffee;
        display: table;
        table-layout: fixed;
        width: 100%;
        border-bottom: 1px solid #ccc;
    }
    .areaCol1 a,.areaCol2 a{
        display: block;
        padding: 18px 10px;
        color: #666;
        background: url("../images/arrowRight_p.png") no-repeat;
        background-size: 13px 13px;
        background-position: 96% center;
        margin-bottom: 0;
    }
    .areaCol1 a:before,.areaCol2 a:before{
        content: "";
    }
    .areaCol2 > div{
        display: table-cell;
        width: 50%;
        border-right:1px solid #ccc;
    }
    .areaCol1 > div{
        width: 50%;
        border-right:1px solid #ccc;
    }
    .areaCol2 > div:last-child{
        border-right:none;
    }
    .areaColBtm{
        margin-bottom: 0;
    }
}
/*=============================================
    area select & design select  main block
==============================================*/
.selectArea,.selectDesign{
    display: table;
    table-layout: fixed;
    width: 100%;
    margin-bottom: 60px;
}
.mainBlock{
    border-left: 1px solid #ddd;
    border-top: 1px solid #ddd;
    border-bottom: 1px solid #ddd;
    border-top-left-radius: 10px;
    border-bottom-left-radius: 10px;
    padding:40px 20px 40px 19px;
    width: 660px;
    display: table-cell;
    background: url(../images/bg_gray.gif) repeat top left;
}
.selectDesign .mainBlock{
    padding:0;
    border-left: 1px solid #ddd;
    border-top:0;
    border-bottom: 1px solid #ddd;
}
.areaHead,.catTitle{
    font-size: 2.0rem;
    border-bottom:1px solid #7e605a;
    padding-bottom: 10px;
    margin-bottom: 20px;
    line-height: 2.4rem;
}
.catList {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    flex-wrap: wrap;
    margin-left: -10px;
    margin-right: -10px;
}
.catList > li{
    float: none;
    margin-bottom: 30px;
    width: 33.333%;
    vertical-align: top;
    padding-right: 10px;
    padding-left: 10px;
    position: relative;
    padding-top: 44px;
    padding-bottom: 55px;
}
@media screen and (max-width: 767px){
    .selectArea{
        margin-bottom: 40px;
    }
    .mainBlock{
        border-left: 1px solid #ddd;
        border-right: 1px solid #ddd;
        border-top: 1px solid #ddd;
        border-bottom: 0;
        border-top-left-radius: 0;
        border-bottom-left-radius:0;
        padding:40px 10px 0;
        width: 100%;
        display: block;
        background: url(../images/bg_gray.gif) repeat top left;
    }
    .selectDesign{
        margin-bottom: 40px;
    }
    .selectDesign .mainBlock{
        border:0;
    }

    .catList > li{
        width: 50%;
        padding-top: 34px;
    }

	.catItem.iconN{
		/* padding-top:0; */
	}
}
.favoriteDeleteButton {
    text-align: center;
}
.favoriteDeleteButton p {
    font-size: 1.3rem;
    line-height: 1.3rem;
    cursor: pointer;
    display: inline-block;
    background-color: #fff;
    padding: 10px 5px 7px 5px;
    border: 1px solid #c1b5b2;
    border-radius: 3px;
    width: 100%;
}
.linkDetail {
    position: absolute;
    bottom:0;
    left:10px;
    width : 98%;
    width : -webkit-calc(100% - 20px) ;
    width : calc(100% - 20px) ;
}
.linkDetail .linkArrow{
    background:url("../images/arrow_w_sp.png") no-repeat #dd2288;
    background-size: 18px 18px;
    background-position: 96% center;
    color: #fff;
    font-size: 1.4rem;
    line-height: 1.4rem;
    border: 1px solid #dd2288;
    padding: 12px 30px 12px 10px;
    display: block;
    margin: 0 auto;
}
.catItem a:hover ~ .linkDetail .linkArrow,
.linkDetail .linkArrow:hover{
    color: #dd2288;
    background: url(../images/arrow_sp.png) no-repeat #fff;
    background-size: 18px 18px;
    background-position: 96% center;
}
@media screen and (max-width: 767px){
    .linkDetail .linkArrow{
        background-size: 14px 14px;
        background-position: 96% center;
        width: 100%;
        font-size: 1.4rem;
        line-height: 1.4rem;
        padding: 16px 30px 16px 10px;
    }
    .favoriteDeleteButton p {
        padding: 7px 5px 4px 5px;
        border: 1px solid #c1b5b2;
    }
}
/*=============================================
		ranking block
==============================================*/
.rankBlock{
    display: table-cell;
    width: 320px;
    border: 1px solid #ddd;
    border-top-right-radius: 10px;
    border-bottom-right-radius: 10px;
    background: url(../images/bg_yellow.gif) repeat top left;
    padding: 40px 20px;
    vertical-align: top;
}
.rankBlock h2 img,.rankListSlides h2 img{
    width: 184px;
}

.rankList {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    flex-wrap: wrap;
    margin-left: -10px;
    margin-right: -10px;
}
.rankList > li{
    width: 100%;
    padding-left: 10px;
    padding-right: 10px;

}

.rankList.is-top > li {
    width: 33.333%;
}

.rankList.is-ranking > li{
    width: 33.333%;
}
.rankList.is-ranking > li:nth-child(n + 7) {
    width: 25%;
}

.rankList.is-top > li:nth-child(n + 7) {
    display: none;
}
.rankIco{
    width: 40px;
    margin-bottom: 10px;
}
/* 1col rank slides */
.rankListSlides{
    width: 980px;
    border: 2px solid #ddd;
    border-radius: 10px;
    background: url(../images/bg_yellow.gif) repeat top left;
    padding: 30px 0;
    vertical-align: top;
    margin: 60px auto 0;
}
.rankListSlides .rankList .slideNext{
    right: -2px;
}
.rankListSlides .rankList .slidePrev{
    left: -2px;
}
@media screen and (max-width: 767px){
    .rankBlock{
        display: block;
        width: 100%;
        border-top-right-radius: 0;
        border-bottom-right-radius: 0;
        background: url(../images/bg_yellow.gif) repeat top left;
        padding: 30px 0;
    }
    .rankListSlides{
        width: 100%;
        border: 1px solid #ddd;
        border-radius: 0;
        margin-top: 40px;
    }
    .rankList > li {
        width: 50%;
        margin-bottom: 20px;
    }
    .rankList.is-top > li {
        width:50%;
    }
    .rankList.is-ranking > li {
        width:50%;
    }
    .rankList.is-ranking > li:nth-child(n + 7) {
        width: 50%;
    }
    .rankIco{
        width: 30px;
        margin-bottom: 10px;
    }
    .rankList .slick-arrow {
        top: 50%;
        margin-top: -54px;
    }
    .rankList .slideNext,.rankListSlides .rankList .slideNext{
        right: -1px;
    }
    .rankList .slidePrev,.rankListSlides .rankList .slidePrev{
        left: -1px;
    }
}
/*=============================================
		design area
==============================================*/
.designArea{
    border: 1px solid #ddd;
    background: url(../images/bg_dot.png) repeat left top;
    padding: 34px 20px 24px;
    border-radius: 10px;
}
.designAreaList li{
    display: inline-block;
    text-align: center;
    margin-left: 60px;
}
.designAreaList li a{
    font-size: 1.6rem;
    line-height: 2.4rem;
    font-weight: bold;
    display: block;
    position: relative;
}
.designAreaList li a:after{
    content: url(../images/arrow_down.png);
    position: absolute;
    -webkit-transform: scale(0.5);
    -moz-transform: scale(0.5);
    transform: scale(0.5);
}
.designAreaList li a:hover{
    text-decoration: underline;
}
.designAreaList li a img{
    margin-bottom: 6px;
}
/*=============================================
		design tabs
==============================================*/
.designTabs{
    background: url(../images/bg_dot.png) repeat left top;
    border-top-left-radius: 10px;
    height: 60px;
    display: table;
    table-layout: fixed;
    width: 100%;
}
.designTab {
    display:table-cell;
}
.designTab a {
    font-size: 1.2rem;
    display: block;
    text-align: center;
    padding: 18px 10px 18px;
    line-height: 2.4rem;
    letter-spacing: -0.08rem;
    background: url("../images/arrow_down.png") no-repeat;
    background-size: 12px 6px;
    background-position: 50% 42px;
    font-weight: bold;
    position: relative;
    border-top: 1px solid #ddd;
    border-bottom: 1px solid #ddd;
    height: 60px;
    vertical-align: middle;
}
.designTab.up a {
    background: url("../images/arrow_up.png") no-repeat;
    background-size: 12px 6px;
    background-position: 50% 12px;
}
.designTab:first-child a{
    border-top-left-radius: 10px;
}
.designTab.current a{
    background: #7e605a;
    padding: 18px 8px 18px;
    color: #fff;
    font-size: 1.4rem;
    border-top: 1px solid #7e605a;
    border-bottom: 1px solid #7e605a;
}
.designTab:first-child.current a{
    border-left: 1px solid #7e605a;
}
.designTab.current a:after{
    content: "";
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 10px 10px 0 10px;
    border-color: #7e605a transparent transparent transparent;
    bottom: -10px;
    left: 40%;
    position: absolute;
}
@media screen and (min-width: 768px){
    .designTab a:hover{
        background: #7e605a;
        padding: 18px 8px 18px;
        color: #fff;
        font-size: 1.4rem;
        border-top: 1px solid #7e605a;
        border-bottom: 1px solid #7e605a;
    }
    .designTab:first-child a:hover{
        border-left: 1px solid #7e605a;
    }
    .designTab a:hover:after{
        content: "";
        width: 0;
        height: 0;
        border-style: solid;
        border-width: 10px 10px 0 10px;
        border-color: #7e605a transparent transparent transparent;
        bottom: -10px;
        left: 40%;
        position: absolute;
    }
}
@media screen and (max-width: 767px){
    .designTabs{
        overflow: auto;
        white-space: nowrap;
        background: none;
        height: 50px;
        border-top: 0;
        border-bottom: 0;
        display: block;
    }
    .designTabs:before{
        position: absolute;
        content:"";
        left: 0;
        top:42px;
        height: 10px;
        width: 100%;
        z-index: 100;
        background: url(../images/bg_pink.gif) repeat;
    }
    .designTab {
        margin-right: 2.5px;
        width: 90px;
        display: inline-block;
    }
    .designTab:last-child{
        margin-right: 0;
    }
    .designTab a {
        font-size: 1.5rem;
        border-radius: 10px 10px 0 0 ;
        padding: 15px 0;
        line-height: 1.7rem;
        background: #7e605a;
        color: #fff;
        height: 50px;
        display: block;
    }
    .designTab.active a{
        background: url(../images/bg_pink.gif) repeat;
    }
}
.designTabPanels{
    position: relative;
}
.designTabPanel{
    position: relative;
    padding: 20px 20px 0 19px;
}
.designTabPanel .catTitle{
    display: none;
}
@media screen and (max-width: 767px){
    .designTabPanels > .designTabPanel {
        display: none;
        padding: 40px 10px 10px;
    }
    .designTabPanels > .designTabPanel.active {
        display: block;
        border-top: 1px solid #ddd;
        border-right: 1px solid #ddd;
        border-left: 1px solid #ddd;
    }
    .designTabPanel .catTitle{
        display: block;
    }
}
/*=============================================
		concept main visual
==============================================*/
.mvConceptIn{
    background: url(../images/bg_mv-concept.jpg) no-repeat top center #fff;
    background-size: cover;
    position: relative;
    padding-top: 10px;
    margin-bottom: 20px;
}
.mvConcept .mvText{
    width: 100%;
}
.mvConcept .mvText p.mvConceptTxt{
    text-align: left;
    font-size: 1.6rem;
    line-height: 3.0rem;
    letter-spacing: -0.1rem;
    margin-top: 20px;
    margin-bottom: 120px;
}
.mvConcept .attention{
    width: 980px;
    margin: 20px auto 10px;
    text-align: right;
    background: #fff;
    color: #999;
}
@media screen and (max-width: 767px){
    .mvConceptIn{
        background: url(../images/bg_mv-concept_sp.jpg) no-repeat top center;
        background-size: 100% auto;
        padding-bottom: 10px;
    }
    .mvConcept .mvText {
        margin-top:0;
        margin-bottom: 60px;
    }
    .mvConcept .mvText .pageTitle img{
        width: 293px;
    }
    .mvConcept .mvText p.mvConceptTxt{
        margin-bottom: 40px;
    }
    .mvConcept .attention{
        width: auto;
        margin: 0 0 40px;
        padding: 0 10px;
        text-align: left;
        background: transparent;
        margin-top: -60px;
        text-indent: -1.5rem;
        margin-left: 1.5rem;
    }
}
/*=============================================
		concept & about nav
==============================================*/
.pageAnchorNavs{
    background: url(../images/bg_dot.png) repeat left top;
    border-top-left-radius: 10px;
    border-top-right-radius: 10px;
    height: 60px;
    display: table;
    table-layout: fixed;
    width: 100%;
}
.pageAnchorNavs li {
    display:table-cell;
    vertical-align: top;
}
.pageAnchorNavs li br{
    display: none;
}
.pageAnchorNavs a {
    font-size: 1.4rem;
    display: table-cell;
    text-align: center;
    padding: 18px 20px 18px;
    line-height: 2.4rem;
    background: url("../images/arrow_down.png") no-repeat;
    background-size: 12px 6px;
    background-position: 50% 42px;
    font-weight: bold;
    position: relative;
    border-top: 1px solid #ddd;
    border-bottom: 1px solid #ddd;
    height: 60px;
    width: 12.5%;
    vertical-align: middle;
}
.pageAbout .pageAnchorNavs a{
    width: 33.3%;
}
.pageAnchorNavs li.up a {
    background: url("../images/arrow_up.png") no-repeat;
    background-size: 12px 6px;
    background-position: 50% 12px;
}
.pageAnchorNavs li:first-child a{
    border-left: 1px solid #ddd;
    border-top-left-radius: 10px;
}
.pageAnchorNavs li:last-child a{
    border-right: 1px solid #ddd;
    border-top-right-radius: 10px;
}
.pageAnchorNavs li.current a{
    background: #7e605a;
    padding: 18px 17px 18px;
    color: #fff;
    font-size: 1.6rem;
    border-top: 1px solid #7e605a;
    border-bottom: 1px solid #7e605a;
}
.pageAnchorNavs li:first-child.current a{
    border-left: 1px solid #7e605a;
}
.pageAnchorNavs li:last-child.current a{
    border-right: 1px solid #7e605a;
}
.pageAnchorNavs li.current a:after{
    content: "";
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 10px 10px 0 10px;
    border-color: #7e605a transparent transparent transparent;
    bottom: -10px;
    left: 50%;
    position: absolute;
}
@media screen and (min-width: 768px){
    .pageAnchorNavs a:hover,
    .pageAnchorNavs li.up a:hover{
        background: #7e605a;
        padding: 18px 17px 18px;
        color: #fff;
        font-size: 1.6rem;
        border-top: 1px solid #7e605a;
        border-bottom: 1px solid #7e605a;
    }
    .pageAnchorNavs li:first-child a:hover{
        border-left: 1px solid #7e605a;
    }
    .pageAnchorNavs li:last-child a:hover{
        border-right: 1px solid #7e605a;
    }
    .pageAnchorNavs a:hover:after{
        content: "";
        width: 0;
        height: 0;
        border-style: solid;
        border-width: 10px 10px 0 10px;
        border-color: #7e605a transparent transparent transparent;
        bottom: -10px;
        left: 50%;
        position: absolute;
    }
}
@media screen and (max-width: 767px){
    .pageAnchorNavs{
        vertical-align: middle;
        height: 70px;
        border-top-left-radius:0;
        border-top-right-radius: 0;
    }
    .pageAnchorNavs li:first-child a{
        border-top-left-radius: 0;
    }
    .pageAnchorNavs li:last-child a{
        border-top-right-radius: 0;
    }
    .pageAnchorNavs a{
        background-position: 50% 52px;
    }
    .pageAnchorNavs a,
    .pageAnchorNavs li.current a {
        font-size: 1.2rem;
        line-height: 1.4rem;
        padding: 20px 2px;
        height: 70px;
    }
    .pageAnchorNavs li.current a:after{
        left: 42%;
    }
    .pageAnchorNavs li br{
        display: inline;
    }
    .pageAbout .pageAnchorNavs a{
        letter-spacing: -0.1rem
    }
    .dotN{
        display: none;
    }
}
/*=============================================
		concept & about contents
==============================================*/
.cntBlock{
    margin:0 auto 40px;
    width: 980px;
}
#voice.cntBlock{
    margin-bottom: 60px;
}
.cntBlock .mainCntsArea{
    border-top: 0;
    padding-top: 0;
    text-align: center;
    border-bottom-left-radius: 10px;
    border-bottom-right-radius: 10px;
}
@media screen and (max-width: 767px){
    .cntBlock{
        width:100%;
    }
    .cntBlock .mainCntsArea{
        border-bottom-left-radius: 0;
        border-bottom-right-radius: 0;
    }
    #voice.cntBlock {
        margin-bottom: 40px;
    }
}
/*========================
		feature
==========================*/
.conceptFeatureList > li{
    border-bottom: 1px solid #ddd;
    padding: 40px 0;
}
.conceptFeatureList li:last-child{
    border-bottom:0;
}
.fTitle{
    margin-bottom: 26px;
}
.fTitle img{
    width: 201px;
}
.fListFree .fTitle{
    margin-top: 25%;
}
.fCnt{
    font-size: 1.8rem;
    line-height: 2.6rem;
    margin-bottom: 25px;
    font-weight: bold;
    letter-spacing: -0.1rem;
}
.fCntSig{
    font-size: 2.4rem;
    line-height: 3.2rem;
    font-weight: bold;
    color: #dd6666;
}
.fCnt .fCntSig img{
    width: 60px;
    height: 24px;
    margin: 0 10px;
    vertical-align: text-top;
}
.fCntImgList{
    margin-bottom: 20px;
}
.fCntImgList li{
    display: inline-block;
    width: 140px;
    margin-right: 20px;
}
.fCntImgList li:last-child{
    margin-right: 0;
}
.attList{
    clear: both;
    text-indent: -1.5rem;
    margin-left: 1.5rem;
}
.attList li{
    font-size: 1.0rem;
    line-height: 1.4rem;
    text-align: left;
}
.fListFree .columnR img{
    width: 420px;
    margin: 0 auto;
}
.imgW300{
    width: 300px;
    margin: 0 auto;
}
.fImgL{
    width: 460px;
}
.fImgM{
    width: 280px;
}
.fMemo01,.fMemo02,.fMemo03{
    position: relative;
}
.fMemo01 img,.fMemo02 img{
    position: absolute;
    top: -55px;
    left: 8px;
}
.fMemo03 img{
    position: absolute;
    top: -55px;
    right: 8px;
}
@media screen and (max-width: 767px){
    .fCnt {
        line-height: 2.4rem;
        margin-bottom: 20px;
    }
    .conceptFeatureList > li {
        padding-bottom: 0;
    }
    .conceptFeatureList li p{
        font-size: 1.8rem;
        line-height: 2.1rem;
        margin-bottom: 10px;
    }
    .conceptFeatureList li .columnL,
    .conceptFeatureList li .columnR{
        width: 300px;
        margin-left: auto;
        margin-right: auto;
        margin-bottom: 30px;
    }
    .attList{
        margin-bottom: 30px;
    }
    .fTitle img{
        width: 198px;
    }
    .fListFree .fTitle{
        margin-top:0;
    }
    .fCntImgList li{
        width: 91px;
        margin-right: 13px;
    }
    .fImgL,.fImgM{
        width: 300px;
    }
    .fMemo01 img{
        width: 181px;
        top: -35px;
        left: 5px;
    }
    .fMemo02 img{
        width: 136px;
        top: -35px;
        left: 5px;
    }
    .fMemo03 img{
        width: 188px;
        top: -35px;
        right: 5px;
    }
}
/*========================
		step
==========================*/
#step .mainCntsArea{
    padding-bottom: 40px;
}
.conceptStepList{
    padding-top: 50px;
}
.conceptStepList > li{
    display: inline-block;
    margin-right: 50px;
    position: relative;
    width: 280px;
    vertical-align: top;
}
.conceptStepList > li.step2{
    width: 290px;
    margin-right: 40px;
}
.conceptStepList > li:last-child{
    margin-right: 0;
}
.conceptStepList > li:after{
    content: url(../images/arrow_right.png);
    position: absolute;
    top: 42%;
    right: -33px;
}
.conceptStepList > li.step2:after{
    top: 32%;
    right: -23px;
}
.conceptStepList > li:last-child:after{
    content: "";
}
.conceptStepList li .bdrImg{
    width: 280px;
}
.sTitle{
    margin-bottom: 15px;
}
.step1 .sTitle img{
    width: 55px;
}
.step2 .sTitle img,.step3 .sTitle img{
    width: 60px;
}
.sCnt{
    font-size: 1.6rem;
    line-height: 2.8rem;
    font-weight: bold;
    margin: 10px 0 3px;
    text-align: left;
    letter-spacing: -0.08rem;
}
.discList{
    text-align: left;
    margin-bottom: 20px;
}
.discList li{
    font-size: 1.4rem;
    line-height: 2.4rem;
    position: relative;
    padding-left: 1rem;
}
.discList li:before{
    content: "･";
    position: absolute;
    top: 0;
    left: 0;
}
.discList li .fcP{
    font-weight: bold;
}
@media screen and (max-width: 767px){
    .conceptStepList > li,
    .conceptStepList > li.step2,
    .conceptStepList > li:last-child{
        display: block;
        margin: 0 auto 46px;
        width: 300px;
    }
    .conceptStepList > li:last-child{
        margin-bottom: 15px;
    }
    .conceptStepList > li:after{
        content: url(../images/arrow_downT.png);
        top: 102%;
        right: auto;
        left: 42%;
        -webkit-transform: scale(0.5);
        -moz-transform: scale(0.5);
        transform: scale(0.5);
    }
    .conceptStepList > li.step2:after{
        top: 100%;
        right: auto;
        left: 42%;
    }
    .conceptStepList li .bdrImg{
        width: 300px;
    }
    .step1 .sTitle img{
        width: 53px;
    }
    .step2 .sTitle img,.step3 .sTitle img{
        width: 58px;
    }
    #step .attList{
        text-indent: -2rem;
        margin-left: 2rem;
        margin-bottom: 0;
    }
}
/*========================
		howto
==========================*/
.hTitle01,.hTitle02{
    font-size: 1.8rem;
    line-height: 2.4rem;
    font-weight: bold;
    padding:3px 0 3px 34px;
}
.hTitle01{
    background: url(../images/icon_doc.png) no-repeat left center;
    background-size: 24px 30px;
}
.hTitle02{
    background: url(../images/icon_pen.png) no-repeat left center;
    background-size: 30px 30px;
    padding-left: 40px;
}
.howtoPart1,.howtoPart2{
    padding: 50px 0 40px;
    text-align: left;
    font-size: 1.6rem;
    line-height: 2.6rem;
}
.howtoPart1{
    border-bottom: 1px solid #ddd;
}
.hCntTitle{
    font-size: 1.6rem;
    line-height: 2.0rem;
    font-weight: bold;
    margin:18px 0 8px;
    position: relative;
}
.hCntTitle:before{
    content: "";
    border-left: 6px solid #7e605a;
    padding-right: 10px;
}
.howtoPart1 .discList li{
    font-size: 1.6rem;
    line-height: 2.6rem;
}
.howtoPart1 .discList{
    margin-bottom: 0;
}
.point{
    color: #dd6666;
    font-size: 1.4rem;
    line-height: 1.8rem;
    margin-top: 12px;
}
.point img{
    width: 50px;
}
.howtoPart1 .attention{
    margin-top: 5px;
}
.hExImgArea{
    margin: 20px 0;
}
.hExImgArea p{
    margin-bottom: 5px;
}
.howtoPart2 .thumbsInfo{
    float: right;
}
.howtoList{
    clear: both;
	counter-reset: count 0;
}
.howtoList dt{
    font-weight: bold;
}
.howtoList > dt:before{
    counter-increment: count;
	content: counter(count) ". ";
	margin-right:5px;
}
.howtoList dt br{
    display: none;
}
.howtoList dd{
    margin-bottom: 10px;
}
@media screen and (max-width: 767px){
    .hCntTitle{
        border-left:0;
        font-weight: bold;
        margin:20px 0 10px;
    }
    .hCntTitle:before{
        border-left:0;
        padding-right: 0;
    }
    .howtoPart1{
        padding:40px 0 30px;
    }
    .howtoPart2{
        padding:30px 0 40px;
    }
    .howtoPart1 p,.howtoPart2 dd{
        line-height: 2.3rem;
    }
    .howtoPart1 p.attention{
        line-height: 1.3rem;
        text-indent: -1.5rem;
        margin-left: 1.5rem;
    }
    .hExImgArea .columnL{
        margin-bottom: 20px;
    }
    .howtoList dt{
        margin-bottom: 6px;
		text-indent:-2.6rem;
		margin-left:2.6rem;
    }
    .howtoList dt br{
        display: inline;
    }
    .howtoList dd{
        margin-bottom: 14px;
    }
}
/*========================
		voice
==========================*/
#voice .mainCntsArea{
    text-align: left;
    padding-top: 50px;
}
.vTitle{
    font-size: 1.8rem;
    line-height: 2.4rem;
    font-weight: bold;
    background: url(../images/icon_heart.png) no-repeat left center;
    background-size: 30px 24px;
    padding-left: 40px;
    margin-bottom: 15px;
}
.vTitle br{
    display: none;
}
.vTitle .voiceName{
    font-size: 1.4rem;
    font-weight: normal;
}
.voicePart{
    background: url(../images/bg_yellow.gif) repeat left top;
    padding: 40px 20px 46px;
    margin-bottom: 50px;
    position: relative;
}
.voicePart:before{
    content:url(../images/icon_clip.png);
    top: -50px;
    left: 46%;
    position: absolute;
    -webkit-transform: scale(0.6);
    -moz-transform: scale(0.6);
    transform: scale(0.6);
}
.voicePart:after{
    content:url(../images/icon_fold.gif);
    bottom: -18px;
    right: -16px;
    position: absolute;
    -webkit-transform: scale(0.5);
    -moz-transform: scale(0.5);
    transform: scale(0.5);
}
.voicePart:last-child{
    margin-bottom: 40px;
}
.vImgList{
    text-align: center;
    margin: 20px 0 0;
}
.vImgList li{
    display: inline-block;
    width: 335px;
    margin: 0 14px;
}
.vTxtList{
    border-top:1px solid #ddd;
    margin-bottom: 20px;
}
.vTxtList li{
    font-size: 1.4rem;
    line-height: 2.6rem;
    border-bottom: 1px solid #ddd;
    padding: 10px 0;
    letter-spacing: -0.1rem;
}
@media screen and (max-width: 767px){
    .voicePart{
        padding: 40px 10px 35px;
        margin-bottom: 45px;
    }
    .vTitle{
        background-position: left 10px;
        margin-bottom: 10px;
        margin-top: 10px;
    }
    .vTitle br{
        display: inline;
    }
    .voicePart:before{
        top: -52px;
        left:42%;
        -webkit-transform: scale(0.5);
        -moz-transform: scale(0.5);
        transform: scale(0.5);
    }
    .vImgList li{
        display: inline-block;
        width: 285px;
        margin: 0 auto;
    }
    .vImgList li:first-child{
        margin-bottom: 15px;
    }
    .vTxtList li{
        line-height: 1.9rem;
        padding: 15px 0;
        letter-spacing:normal;
    }
}
/*=============================================
		about
==============================================*/
.pageAbout .pageCntHead{
    margin-top: 60px;
    margin-bottom: 30px;
}
#project .mainCntsArea,#machikyun .mainCntsArea,#faq .mainCntsArea{
    text-align: left;
    padding-top: 40px;
    padding-bottom: 40px;
    margin-bottom: 40px;
}
.aboutPart {
    padding-bottom: 40px;
    margin-bottom: 40px;
    border-bottom: 1px solid #ddd;
}
.aboutPart.last{
    padding-bottom: 0;
    margin-bottom: 0;
    border-bottom: 0;
}
.aboutPart .subTitle{
    margin-bottom: 10px;
}
.aboutPart p{
    letter-spacing: -0.08rem;
}
@media screen and (max-width: 767px){
    .pageAbout .pageCntHead{
        margin-top: 40px;
    }
    .aboutPart {
        padding-bottom: 30px;
        margin-bottom: 30px;
    }
    .pageAbout .mainCntsArea .subTitle.rbnP {
        background: url(../images/ribbon_pink_sp.png) no-repeat left center;
        background-size: 30px 37px;
    }
}
/*========================
		project
==========================*/
.abCol2-1{
    float: left;
    width: 620px;
}
.abCol2-2{
    float: right;
    width: 300px;
}
.prjImg{
    margin-top: 24px;
}
.prjImg li{
    width: 300px;
    display: inline-block;
    vertical-align: top;
    margin-right: 20px;
    text-align: center;
    font-size: 1.4rem;
    line-height: 1rem;
}
.prjImg li:last-child{
    margin-right: 0;
}
.prjImg li .bdrImg{
    margin-bottom: 0;
}
.toDetail {
    font-size: 1.4rem;
    line-height: 2.4rem;
    text-align: right;
}
.abCol2-1 .attList{
    margin-bottom: 20px;
    margin-top: 14px;
}
@media screen and (max-width: 767px){
    .prjImg{
        margin-top: 20px;
    }
    .prjImg li,.prjImg li:last-child{
        margin: 0 auto;
        font-size: 1.6rem;
        line-height: 1.2rem;
        display: block;
        margin-bottom: 20px;
    }
    .prjImg li:last-child{
        margin-bottom: 0;
    }
    .abCol2-1,.abCol2-2{
        float: none;
        width: 100%;
    }
    .abCol2-1 .attList{
        margin-bottom: 22px;
        margin-top: 10px;
    }
    .toDetail {
        margin-bottom: 20px;
    }
}
/*========================
		machikyun
==========================*/
#machikyun .mainCntsArea{
    padding-bottom: 0;
}
#machikyun .voicePart{
    margin-top: 50px;
}
#machikyun .voicePart .hCntTitle{
    margin-bottom: 15px;
}
#machikyun .vImgList{
    margin-bottom: 36px;
    margin-top: 36px;
}
#machikyun .vImgList li{
    margin: 0 12px;
}
#machikyun .voicePart p.interviewTxt{
    font-size: 1.4rem;
    line-height: 2.5rem;
    margin-top: 3px;
}
@media screen and (max-width: 767px){
    #machikyun .voicePart{
        margin-top: 55px;
        padding-bottom: 50px;
    }
    #machikyun .vTitle{
        background-position: left center;
        margin-bottom: 20px;
    }
    #machikyun .vImgList{
        margin-bottom: 15px;
        margin-top: 15px;
    }
    #machikyun .vImgList li{
        width: 134px;
        margin-right: 10px;
        margin-left: 0;
    }
    #machikyun .vImgList li:last-child{
        margin-right: 0;
    }
    #machikyun .voicePart .hCntTitle{
        text-indent: -1.4rem;
        margin-left: 1.4rem;
        line-height: 2.4rem;
        margin-bottom: 8px;
    }
    #machikyun .voicePart .hCntTitle:before{
        border-left: 6px solid #7e605a;
        padding:2px 0 2px 10px;
    }
    #machikyun .voicePart p.interviewTxt{
        font-size: 1.6rem;
        line-height: 2.4rem;
    }
}
/*========================
		FAQ
==========================*/
#faq.cntBlock{
    margin-bottom: 60px;
}
.faqQ{
    font-size: 1.8rem;
    line-height: 2.4rem;
    font-weight: bold;
    margin-bottom: 20px;
    margin-left: 28px;
    position: relative;
}
.faqQ:before{
    content: "Q.";
    position: absolute;
    left: -28px;
    top:0;
}
.faqA{
    margin-left: 28px;
    position: relative;
}
.faqA:before{
    content: "A.";
    font-weight: bold;
    color: #dd6666;
    font-size: 1.8rem;
    position: absolute;
    left: -28px;
    top:0;
}
@media screen and (max-width: 767px){
    #faq .aboutPart{
        margin-bottom: 46px;
        padding-bottom: 20px;
    }
    #faq .aboutPart.last{
        margin-bottom: 0;
        padding-bottom: 0;
    }
    .faqQ{
        line-height: 2.0rem;
        margin: 26px 0 40px 0;
    }
    .faqQ:before{
        left: 0;
        top:-26px;
    }
    .faqA{
        margin-left: 0;
    }
    .faqA:before{
        left: 0;
        top:-26px;
    }
}
.contactInfo{
    border: 1px solid #7e605a;
    padding: 30px 30px 25px;
    background: #ffffee;
    border-radius: 10px;
    margin-top: 40px;
}
.contactTtl{
    font-size: 1.8rem;
    line-height: 2.4rem;
    font-weight: bold;
    margin-bottom: 15px;
    background: url(../images/icon_mail.png) no-repeat left center;
    background-size: 30px 23px;
    padding-left: 40px;
}
.contactInfo p{
    letter-spacing: normal;
}
.contactInfo p br{
    display: none;
}
.add{
    font-size: 1.4rem;
    margin-top: 10px;
}
.add a{
    padding-top:2px;
}
@media screen and (max-width: 767px){
    .contactInfo{
        padding: 20px 10px 16px;
        margin-top: 20px;
    }
    .contactTtl{
        margin-bottom: 18px;
    }
    .contactInfo p br{
        display: inline;
    }
    .contactInfo p.coName{
        line-height: 2.1rem;
        margin-bottom: 8px;
    }
}
/*=============================================
		news archives
==============================================*/
.pageNews .pageCntHead{
    margin-top: 60px;
    margin-bottom: 30px;
}
.pageNews .newsList{
    margin-bottom: 60px;
}
.pageNews .newsList li{
    padding:12px 10px 12px 60px;
    line-height: 2.5rem;
}
.pageNews .newsList li p.newsTitle{
    font-size: 1.4rem;
    line-height: 2.5rem;
    display: inline-block;
    vertical-align: top;
}
.date{
    font-weight: bold;
    margin-right: 15px;
}
.tag{
    background: #7e605a;
    color: #fff;
    font-size: 1.2rem;
    padding: 4px 8px;
    border-radius: 3px;
    margin-right: 15px;
}
@media screen and (max-width: 767px){
    .pageNews .pageTitle img{
        width: 224px;
    }
    .pageNews .pageCntHead{
        margin-top: 40px;
    }
    .pageNews .newsList li{
        padding:20px 0 16px;
    }
    .pageNews .newsList li.new{
        padding-left: 45px;
        background: url(../images/icon_new.png) no-repeat 0 18px;
        background-size: 34px 34px;
    }
    .pageNews .newsList li p.newsTitle{
        margin-top: 10px;
    }
    .pageNews .newsList li.new p.newsTitle{
        display: block;
        margin-left: -45px;

    }
}
/*=============================================
		download
==============================================*/
.dlStep{
    text-align: center;
}
.dlStep li{
    display: inline-block;
}
.dlStep li:last-child{
    margin-left: -8px;
}
.pageDL .mainCntsArea{
    border-radius: 10px;
    padding: 60px;
    text-align: center;
    margin-bottom: 60px;
}
.pageDL.dlkyoto .mainCntsArea{
    padding: 60px 19px;
}
.pageDL .pageCntHead{
    margin: 40px 0;
}
.dlMessage{
    line-height: 3.0rem;
    font-size: 1.8rem;
    margin-bottom: 40px;
}
.dlMessage .fs22{
    font-size: 2.2rem;
}
.linkTerm{
    margin-bottom: 40px;
    line-height: 1;
}
.linkTerm a{
    text-decoration: underline;
    font-size: 1.2rem;
}
.sendUrl{
    letter-spacing: -0.14rem;
    margin-bottom: 20px;
}
.mail{
    margin-bottom: 10px;
}
.mail li{
    display: inline-block;
    margin-right: 10px;
}
.mail li:last-child{
    margin-right: 0;
}
.secInfo,.secFaq,.messageArea{
    margin-bottom: 60px;
}
.dlFaqPart{
    padding-bottom: 18px;
    margin-bottom: 20px;
    border-bottom: 1px solid #ddd;
}
.dlFaqPart .faqQ{
    font-size: 1.6rem;
    margin-bottom: 10px;
}
.faqlink{
    text-align: right;
    font-size: 1.4rem;
}
.faqlink .linkTxt{
    padding-right: 38px;
}
.pageDL .secFaq .attention{
    margin:10px 0 6px 40px;
}
.messageArea p{
    font-size: 2.2rem;
    line-height: 3.0rem;
    color: #dd6666;
    text-align: center;
}
.kyotoItem{
    margin-right: 20px;
    margin-bottom: 20px;
    width: 300px;
    float: left;
}
.kyotoItem:last-child{
    margin-right: 0;
}
.kyotoItem h3{
    font-size: 1.6rem;
    line-height: 2.4rem;
    font-weight: bold;
    margin-bottom: 6px;
}
.kyotoItem .bdrImg{
    margin-bottom: 30px;
}
@media screen and (max-width: 767px){
    .dlStep li{
        width: 154px;
    }
    .pageDL .pageCntHead{
        margin-top: 30px;
        margin-bottom: 30px;
    }
    .pageDL .mainCntsArea,
    .pageDL.dlkyoto .mainCntsArea{
        padding: 40px 10px;
        border-radius: 0;
        margin-bottom: 40px;
    }
    .pageDL .attention{
        text-align: left;
        text-indent: -1rem;
        margin-left: 1rem;
    }
	.dlMessage{
		letter-spacing:-0.22rem;
	}
    .secInfo,.secFaq,.messageArea{
        margin-bottom: 40px;
        padding-left: 10px;
        padding-right: 10px;
    }
    .secInfo .subTitle,.secFaq .subTitle{
        padding-top: 4px;
    }
    .messageArea p{
        letter-spacing: -0.2rem;
    }
    .linkTerm{
        margin-bottom: 30px;
    }
    .mail{
        margin-bottom: 15px;
    }
    .mail img{
        width: 82px;
    }
    .dlFaqPart .faqQ{
        margin:44px 0 34px;
    }
    .faqlink{
        margin-top: 12px;
        letter-spacing: -0.1rem;
    }
    .pageDL .secFaq .attention{
        margin-top: 14px;
        margin-left: 10px;
    }
    .secBanner .subTitle{
        margin-bottom: 10px;
        padding-top: 4px;
    }
    .kyotoItem{
        float: none;
        margin: 0 auto 30px;
        width: 100%;
    }
    .kyotoItem .bdrImg {
        margin-bottom: 20px;
    }
}
/*=============================================
		entry
==============================================*/
.secEntry{
    counter-reset: question;
}
.secEntry .subTitle{
    margin-bottom: 9px;
}
.secEntry .attention{
    padding-top: 8px;
    float: right;
}
.eHead{
    font-size: 2.2rem;
    line-height: 3.0rem;
    text-align: center;
    margin-bottom: 26px;
    letter-spacing: -0.2rem;
}
.icoW{
    background: url(../images/icon_write.png) no-repeat left center;
    background-size: 20px 20px;
}
@media screen and (max-width: 767px){
    .secEntry .subTitle {
        margin-left: 10px;
        min-height: 0;
        padding-left: 25px;
        float: none;
        margin-bottom: 6px;
    }
    .pageDL .secEntry .attention {
        padding-top: 0;
        float: none;
        margin-left: 10px;
        margin-bottom: 20px;
        line-height: 1.2rem;
        text-indent: 0;
        letter-spacing: -0.06rem;
    }
}
.entryPart{
    display: table;
    width: 100%;
    table-layout: fixed;
    border-bottom: 1px solid #ddd;
    border-left: 1px solid #ddd;
    border-right: 1px solid #ddd;
}
.eQ, .eA{
    display: table-cell;
    width: 50%;
    vertical-align: top;
}
.eQ{
    background: url(../images/bg_pinkT.gif) repeat left top;
    padding: 37px 20px;
}
.require .eQ{
    background: url(../images/bg_redT.gif) repeat left top;
}
.eA{
    background: url(../images/bg_gray.gif) repeat left top;
    font-size: 1.4rem;
    line-height: 2.6rem;
    padding: 40px 20px 34px;
}
.requireM1,.requireM2{
    color: #fff;
    font-size: 1.2rem;
    line-height: 1;
    background: #dd0000;
    display: inline-block;
    border-radius: 3px;
}
.requireM1{
    font-size: 1.0rem;
    padding: 2px 4px;
}
.requireM2{
    vertical-align: middle;
    padding: 4px 8px;
    margin-left: 5px;
}
.entryPart.firstRow{
    border-top-right-radius: 10px;
    border-top-left-radius: 10px;
    border-top: 1px solid #ddd;
    clear:both;
}
.firstRow .eQ{
    border-top-left-radius: 10px;
}
.firstRow .eA{
    border-top-right-radius: 10px;
}
.entryPart.lastRow{
    border-bottom-right-radius: 10px;
    border-bottom-left-radius: 10px;
    margin-bottom: 60px;
}
.lastRow .eQ{
    border-bottom-left-radius: 10px;
}
.lastRow .eA{
    border-bottom-right-radius: 10px;
}
@media screen and (max-width: 767px){
    .eQ, .eA{
        display: block;
        width: 100%;
        padding: 27px 10px;
    }
    .eA{
        font-size: 1.4rem;
        line-height: 2.6rem;
        padding: 30px 10px;
    }
    .entryPart.firstRow,.firstRow .eQ,.firstRow .eA,
    .entryPart.lastRow,.lastRow .eQ,.lastRow .eA{
        border-radius: 0;
    }
    .entryPart.lastRow{
        margin-bottom: 40px;
    }
}
.labelQ{
    font-size: 1.8rem;
    line-height: 2.4rem;
    margin-left: 4rem;
    position: relative;
    font-weight: bold;
}
.labelQ:before{
    counter-increment: question;
    content: "Q" counter(question) ".";
    position: absolute;
    left: -4rem;
    top:0;
}
.entryPart:nth-child(n+10) .labelQ{
    margin-left: 5rem;
}
.entryPart:nth-child(n+10) .labelQ:before{
    left: -5rem;
}
.aEx{
    font-weight: normal;
    font-size: 1.6rem;
}
.answerList{
    margin-top: -6px;
}
.answerList li{
    margin-bottom: 4px;
}
.answerList li:last-child{
    margin-bottom: 0;
}
.eA input[type="checkbox"]{
    margin-right: 10px;
}
.eA input[type="text"]{
    width: 100%;
    border-radius: 3px;
    border: 1px solid #999;
}
.eA textarea{
    width: 100%;
    height: 100%;
    border-radius: 3px;
    border: 1px solid #999;
}
.eA select{
    width: 200px;
    font-size: 1.2rem;
    line-height: 2.6rem;
}
.eA.vMiddle{
    vertical-align: middle;
}
.sWrap:first-child{
    margin-bottom: 20px;
}
@media screen and (max-width: 767px){
    .answerList{
        margin-top: 0;
    }
    .answerList li{
        margin-bottom: 23px;
        line-height: 1.9rem;
    }
    .eA input,.eA select,.eA textarea{
        font-size: 1.6rem;
    }
}
/*=============================================
		error
==============================================*/
.pageErr .mainCntsArea{
    border-radius: 10px;
    padding:56px 0 40px;
    text-align: center;
    margin:40px 0 60px;
}
.erTitle{
    font-weight: bold;
    font-size: 2.2rem;
    margin-bottom: 36px;
    line-height: 3.0rem;
    color: #dd6666;
}
.linkBack{
    font-size: 1.4rem;
    margin: 40px 0 20px;
}
@media screen and (max-width: 767px){
    .pageErr .mainCntsArea{
        padding: 40px 10px;
        border-radius: 0;
        margin-bottom: 60px;
    }
    .erTitle{
        margin-bottom: 26px;
    }
    .linkBack{
        margin-top: 30px;
    }
    .pageErr .attention{
        line-height: 1.2rem;
        text-indent: -1rem;
        margin-left: 1rem;
        text-align: left;
    }
}
/*=============================================
		footer
==============================================*/
.pageFooter{
    overflow: hidden;
}
.pageFooterTop{
    width: 100%;
    background-image: url(../images/bg_footTop.png),url(../images/bg_footTop_bg.png);
    background-repeat: no-repeat, repeat;
    background-position: center top , left bottom;
    background-size: 100% ,auto;
    text-align: center;
    padding: 60px 0;
}
.pageFooterTop a{
    font-size: 1.6rem;
    line-height: 1;
    display: inline-block;
}
.pageFooterTop a img{
    margin-bottom: 10px;
}
@media screen and (min-width: 768px){
    .pageFooterTop a:hover img{
        opacity: .8;
    }
}
.fbArea{
    margin-bottom: 30px;
}
.bannerList a{
    display: block;
}
.footerBanner{
    width: 100%;
    background: url(../images/bg_footBnr.png) repeat-x top left;
    text-align: center;
    padding: 40px 0 30px;
    position: relative;
}
.footerBanner:after{
    content: url(../images/bg_illust.png);
    position: absolute;
    top:-60px;
    left: 50%;
    margin-left: -550px;
}
@media screen and (max-width: 979px){
    .footerBanner:after{
        top:-59px;
    }
}
@media screen and (max-width: 767px){
    .pageFooter{
        overflow:visible;
        margin-top: 140px;
    }
    .pageFooterTop{
        width: 100%;
        background-image: url(../images/bg_footTop_bg.png);
        background-repeat: repeat;
        background-position:  left bottom;
        background-size: auto;
        text-align: center;
        padding: 0 0 50px;
        position: relative;
    }
    .pageFooterTop:before{
        content: "";
        position: absolute;
        background-image: url(../images/bg_footTop_sp.png);
        background-repeat: no-repeat;
        background-position: center top ;
        background-size: 100% ;
        top:-70px;
        left: 0;
        width: 100%;
        height: 70px;
    }
    .fbArea{
        margin-left: 35px;
        margin-right: 35px;
    }
    .footerBanner{
        background: url(../images/bg_footBnr_sp.gif) repeat top left;
        padding: 30px 0;
    }
    .footerBanner:after{
        content: url(../images/bg_illust_sp.png);
        -webkit-transform: scale(0.5);
        -moz-transform: scale(0.5);
        transform: scale(0.5);
        top:-47px;
        left: 50%;
        margin-left: -320px;
    }
}
.bannerList{
    margin-bottom: 20px;
}
.bannerList li{
    display: inline-block;
    margin: 0 5px;
    width: 180px;
}
#footerLink.linkArea p {
	color: #fff;
	color: #fff;text-indent: -1.5rem;
    margin-left: 1.5rem;
	display: inline-block;
	text-align: left;
	padding: 10px 0 0;
}
#footerLink.linkArea p a {
	color: #fff;
	text-decoration: underline;
}
#footerLink.linkArea .linkArrow{
    width: 370px;
    margin: 0 auto;
    line-height: 2.2rem;
    padding: 18px 0 ;
}
@media screen and (max-width: 767px){
    .bannerList{
        padding: 0 10px;
        margin-bottom: 30px;
    }
    .bannerList li{
        display:block;
        width: 100%;
        margin: 0 0 5px 0;
    }
    .bannerList li img{
        min-width:300px;
    }
    #footerLink.linkArea .linkArrow{
        width: 100%;
        font-size: 1.8rem;
    }
}
.footerBnrBtm{
    text-align: center;
    padding: 15px;
}
.footerBnrBtm img{
    width: 221px;
}
.footerCnt{
    width: 100%;
    border-top:2px solid #dd6666;
    padding: 10px 0 15px;
    font-size: 1.2rem;
}
.fNav {
    float: right;
    margin: 23px 0 0;
    line-height: 1;
}
.fNav > li:first-child {
    border: none;
}
.fNav > li {
    display: inline-block;
    border-left: 1px solid #775c55;
    padding: 0 20px;
}
.fNav a:hover,.copyright a:hover{
    text-decoration: underline;
}
.copyright {
    float: left;
    margin: 0;
    line-height: 1.2rem;
    font-size: 1.2rem;
}
.copyright a{
    color: #415e66;
    text-decoration: underline;
}
.copyright img {
    margin: 0 0 7px;
    width: 317px;
}
@media screen and (max-width: 767px){
    .fNav {
        float: none;
        margin: 15px 0;
        font-size: 1.3rem;
        text-align: center;
    }
    .fNav > li {
        padding:0 15px;
        letter-spacing: -0.06rem
    }
    .fNav > li:first-child {
        padding-left: 0;
    }
    .fNav > li:last-child {
        padding-right: 0;
    }
    .copyright {
        float: none;
        margin: 0 auto;
    }
    .copyright img {
        width: 295px;
    }
}

/*=============================================
		announcement
==============================================*/
 .announcement {
    margin-top: -170px;
    margin-bottom: 30px;
 	padding: 20px 14px;
 	text-align: center;
 	background-color: #fff;
 	border: 1px solid #dd6666;
 	border-radius: 2px;
 }

.announcement_2 {
    margin-top: 0;
    margin-bottom: 30px;
	padding: 10px 14px;
	max-width: 500px;
}
@media screen and (max-width: 767px){
	.announcement {
		margin-top: 0;
	}
}

@media screen and (min-width: 768px){
    .mv .inner,
    .mvConcept .inner {
        position: relative;
    }
    .mvTop {
        position: absolute;
        top:0;
        right: 0;
    }
}
