@charset "utf-8";

/* ---------------------------------------------------------------------------------
base */

*{ box-sizing: border-box;　}

body{height: 100%;}

@media(max-width:750px){
	
body{ font-size:160%; }

}



img{ vertical-align:bottom;-ms-interpolation-mode: bicubic;}

a{ color:#da7601;text-decoration: none;}
a:visited{ color:#da7601;text-decoration: none;}
a:active{ color:#1fa1ad;text-decoration:none;}
a:hover{ color:#1fa1ad;text-decoration:none;}

html,body{ height:100%; }

body{ background:#fff; color:#101010;
font-family: 'Noto Sans JP',"メイリオ","ヒラギノ角ゴ Pro W3",Meiryo, Osaka,  sans-serif;
}
#wrapper{ height:100%;}

@media(max-width:750px){


}


/* ---------------------------------------------------------------------------------
common */


#bodyInner.bg01{background: url(../images/background01.jpg) no-repeat center center; background-size: cover; min-height: 100%; }
#bodyInner.bg02{background: url(../images/background02.jpg) no-repeat center center; background-size: cover; min-height: 100%; }
#bodyInner.bg03{background: url(../images/background03.jpg) no-repeat center center; background-size: cover; min-height: 100%; }
#bodyInner.bg04{background: url(../images/background04.jpg) no-repeat center center; background-size: cover; min-height: 100%; }
#bodyInner.bg05{background: url(../images/background05.jpg) no-repeat center center; background-size: cover; min-height: 100%; }
#bodyInner.bg06{background: url(../images/background06.jpg) no-repeat center center; background-size: cover; min-height: 100%; }

#bodyInner.bg07{background: url(../images/background07.jpg) no-repeat center center; background-size: cover; min-height: 100%; }



@media(min-width:751px){

.wrapper01{ display: table; width: 100%; height: 100%; box-sizing:0; padding:50px 0;}
.wrapper02{ display: table-cell; vertical-align: middle; }
.wrapper03{ display: table; width: 950px; margin: 0 auto; background: rgba(255,255,255,0.6);min-height: 540px; position: relative;}

#headerBlock{ width:270px; display: table-cell;height: 100%;background: #232323 url(/common/images/header_bg.png) repeat-x left top;}
#contents{ width:auto; display: table-cell;height: 100%; vertical-align: middle; position: relative;}

#headerBlock >.inner{ height: 100%;}
    
#gHeader{width: 100%; display:table;min-height: 540px; height:100%; padding: 0; margin: 0;}
#gHeader >.inner{display: table-cell; padding-top:190px;text-align: center; }
#gHeader h1{ width:70%; margin: 0 auto; display: inline-block;}
#gHeader h1 img{ width:100%;}

}


@media(max-width:750px){

.wrapper01{ display: block; width: 100%; height: 100%; box-sizing:0; padding:40px 0;}
.wrapper02{ display: block; vertical-align: middle; }
.wrapper03{ display: block; width: 670px; margin: 0 auto; background: rgba(255,255,255,0.6);min-height: 500px;}

#headerBlock{ width:auto; display: block;height: 100%;background: #232323 url(../images/header_bg.png) repeat-x left top;}
#contents{ width:auto; display: block;height: 100%; vertical-align: middle; position: relative;}

#headerBlock >.inner{ height: 100%;}
    
#gHeader{width: 100%; display:block;height:100%; padding: 0; margin: 0;}
#gHeader >.inner{display: block; padding:50px 0;text-align: center; }
#gHeader h1{ width:30%; margin: 0 auto; display: inline-block;}
#gHeader h1 img{ width:100%;}

}



p{font-size:90%; line-height: 1.5em;max-height:99999999px;}


a > img{ width:100%;}
.imgbox img{ width:100%;}



.fadein {  transform: translateY(20px);  opacity : 0;  transition: all 0.7s  ease-out;}
.faderight {  transform: translateX(20px);  opacity : 0;  transition: all 0.7s  ease-out;}

.ease__float{animation:float 4.4s ease-out infinite;transform-origin:50% 50%}

}




h1 img,
h2 img,
h3 img,
p img,
span img,
a img{ width: 100%;}




@media(max-width:750px){


}



/* ---------------------------------------------------------------------------------
header */


@media(max-width:750px){

}



/* ---------------------------------------------------------------------------------
nav */


#pcNavi{ position: absolute; top: 30px; left: 30px; z-index: 10;}
#pcNavi ul{}

#pcNavi ul:before,
#pcNavi ul:after {content: " ";display:table;}
#pcNavi ul:after {clear: both;}
#pcNavi ul{*zoom: 1;}

#pcNavi li{ float: left; margin-right: 10px;}
#pcNavi li a,
#pcNavi li span{
    width: 20px; height: 20px;
    display: block;
    background-image : url("../images/star.png");
    background-size: 20px auto;
    background-position: center top;
    text-indent: 100%;
    white-space: nowrap;
    overflow: hidden;}


#pcNavi li a:hover{
    background-position: center bottom;
}

#pcNavi li.now a{
    background-position: center bottom;
}



@media(max-width:750px){

#pcNavi{ position: absolute; top: 50px; left: 50px;}

#pcNavi li{margin-right: 20px;}
    
#pcNavi li a,
#pcNavi li span{
    width: 40px; height: 40px;
    display: block;
    background-image : url("../images/star.png");
    background-size: 40px auto;

}


}



/* ---------------------------------------------------------------------------------
top */

#contCell{margin: 0 40px;}

#contCell.top{}
#contCell.top h2{ color: #755e35; text-align: right; font-size: 29px; margin-bottom: 1em;font-family: 'Marcellus', serif; font-weight: normal;}
#contCell.top p{ color: #101010; text-align: right; font-size: 14px; line-height: 2em;font-family: 'Asap', sans-serif; margin: 0;}


@media(max-width:750px){

#contCell{margin: 0 50px;padding: 180px 0}

#contCell.top{}
#contCell.top h2{font-size: 45px; font-weight: normal;}
#contCell.top p{ font-size: 28px; margin: 0;}

}
/* ---------------------------------------------------------------------------------
advertising */

#contCell{margin: 0 40px;}

#contCell.advertising{ width: 370px; margin: 0 auto;}
#contCell.advertising h2{ color: #3d5522; text-align: left; font-size: 28px; margin-bottom: 1em;font-family: 'Marcellus', serif; font-weight: normal;}
#contCell.advertising h3{ text-align: left; font-size: 20px; margin-bottom: 0.5em;font-family: 'Asap', sans-serif;font-weight: normal;}
#contCell.advertising p{ color: #101010; text-align: left; font-size: 13px; line-height: 1.8em;margin: 0 0 2em; 0;}

#contCell.advertising p.last{margin:0}


@media(max-width:750px){

#contCell{margin: 0 50px;padding: 180px 0}

#contCell.advertising{ width: auto; margin: 0 50px;}
#contCell.advertising h2{font-size: 45px; font-weight: normal;}
#contCell.advertising h3{font-size: 36px; font-weight: normal;}
#contCell.advertising p{ font-size: 28px; }
#contCell.advertising p.last{margin:0}

}



/* ---------------------------------------------------------------------------------
outsourcing */

#contCell{margin: 0 40px;}

#contCell.outsourcing{ width: 370px; margin: 0 auto;} 
#contCell.outsourcing h2{ color: #715749; text-align: left; font-size: 28px; margin-bottom: 1em;font-family: 'Marcellus', serif; font-weight: normal;}
#contCell.outsourcing h3{ text-align: left; font-size: 20px; margin-bottom: 0.5em;font-family: 'Asap', sans-serif;font-weight: normal;}
#contCell.outsourcing p{ color: #101010; text-align: left; font-size: 13px; line-height: 1.8em;margin: 0 0 2em; 0;}

#contCell.outsourcing p.last{margin:0}


@media(max-width:750px){

#contCell{margin: 0 50px;padding: 180px 0}


#contCell.outsourcing{ width: auto; margin: 0 50px;} 
#contCell.outsourcing h2{font-size: 45px; font-weight: normal;}
#contCell.outsourcing h3{font-size: 36px; font-weight: normal;}
#contCell.outsourcing p{ font-size: 28px; }
#contCell.outsourcing p.last{margin:0}

}





/* ---------------------------------------------------------------------------------
cafe */

#contCell{margin: 0 40px;}

#contCell.cafe{ width: auto; margin: 0 30px;padding-bottom: 0;}
#cafeh2area{display: block; position: relative;}
#cafeh2area .instaicon{width: 80px; position: absolute; bottom: 0; right:0;}
#cafeh2area .instaicon img{ width: 100%;}

#contCell.cafe h2{ color: #715749; text-align: left; font-size: 28px; margin-bottom: 1em;font-family: 'Marcellus', serif; font-weight: normal; width: 180px; margin: 30px auto; }



#contCell.cafe h2 img{width: 100%;}
#contCell.cafe h3{ text-align: left; font-size: 20px; margin-bottom: 0.5em;font-family: 'Asap', sans-serif;font-weight: normal;}
#contCell.cafe p{ color: #101010; text-align: left; font-size: 13px; line-height: 1.8em;margin: 0 0 2em; 0;}
#contCell.cafe p.last{margin:0}




#NowMap{ margin-bottom: 30px; width: 100%;}

.crm2Box2{ width: 100%; display: table; margin: 0 auto 30px auto;;padding: 0;}
.crm2Box2 .crmbox{ width: 50%; display: table-cell;}
.crm2Box2 .crmbox img{ width: 100%}

.crm2Box2 .crm01{ padding-right: 30px; border-right: none; vertical-align: top;}
.crm2Box2 .crm02{ padding-bottom: 10px; vertical-align: top;}

.crm2Box2 p{}
.crm2Box2 span.param{ display: inline-block; background: #000; font-size: 12px; line-height: 1em; color: #fff; padding: 5px 10px;margin-bottom: 0.5em;}
.crm2Box2  .crm02 h3{ font-size: 18px; margin-bottom: 1em;}
.crm2Box2  .crm02 dl{}
.crm2Box2  .crm02 dt{ font-size: 13px; margin-bottom: 0em; line-height: 1em;}
.crm2Box2  .crm02 dd{ font-size: 13px; margin-bottom: 1em; line-height: 1.5em;}


@media(max-width:750px){

#contCell{margin: 0 50px;padding: 180px 0}

#contCell.cafe{ position: relative; top: -80px; padding-bottom: 0;}
#contCell.cafe h2{ width: 260px; margin: 30px auto}
#contCell.cafe h3{font-size: 36px; font-weight: normal;}
#contCell.cafe p{ font-size: 28px; }
#contCell.cafe p.last{margin:0}

#cafeh2area .instaicon{width: 120px; position: absolute; top: -100px; right:0;}
#cafeh2area .instaicon img{ width: 100%;}
    
.crm2Box2{ display: block; margin: 0 auto 30px auto;;padding: 0;}
.crm2Box2 .crmbox{ width: 100%; display:block;}
.crm2Box2 .crmbox img{ width: 100%}

.crm2Box2 .crm01{ padding-right: 0; border-right: none; vertical-align: top;}
.crm2Box2 .crm02{ padding-bottom: 0; vertical-align: top;}

.crm2Box2 p{}
.crm2Box2 span.param{ display: inline-block; background: #000; font-size: 24px; line-height: 1em; color: #fff; padding: 5px 10px;margin-bottom: 0.5em;}
.crm2Box2  .crm02 h3{ font-size: 36px; margin-bottom: 1em;}
.crm2Box2  .crm02 dl{}
.crm2Box2  .crm02 dt{ font-size: 30px; margin-bottom: 0.5em; line-height: 1em;}
.crm2Box2  .crm02 dd{ font-size: 28px; margin-bottom: 1em; line-height: 1.5em;}
    
}

/* ---------------------------------------------------------------------------------
golf */


#golfHeader{  text-align: center;margin-top: 100px;margin-bottom: 100px;}
#golfHeader img{ width: 40%;}

#g_concept{ text-align: center;margin-bottom: 100px;}
#g_concept img{ width: 70%;}

#g_item{ margin-bottom: 100px;}
#g_item img{ width: 100%;}

#g_item .oneItem{ text-align: center;}
#g_item .oneItem img{width: 70%;}


@media(max-width:750px){

#golfHeader{  text-align: center;margin-top: 0;margin-bottom: 100px;}
#golfHeader img{ width: 60%;}

#g_concept{ text-align: center;margin-bottom: 100px;}
#g_concept img{ width: 70%;}

#g_item{ margin-bottom: 100px;}
#g_item img{ width: 100%;}

#g_item .oneItem{ text-align: center;}
#g_item .oneItem img{width: 70%;}

}



/* ---------------------------------------------------------------------------------
yado */

.yado .videoContainer{ margin-bottom: 50px;}
.yado .videoContainer video{ width: 100%;}

#contCell.yado{ width: auto; margin: 0 30px;padding-bottom: 0;}
#yadoh2area{display: block; position: relative;}
#yadoh2area .instaicon{width: 80px; position: absolute; bottom: 0; right:0;}
#yadoh2area .instaicon img{ width: 100%;}

#contCell.yado h2{ color: #715749; text-align: left; font-size: 28px; margin-bottom: 1em;font-family: 'Marcellus', serif; font-weight: normal; width: 180px; margin: 30px auto; }

#contCell.yado h2 img{width: 100%;}
#contCell.yado h3{ text-align: left; font-size: 20px; margin-bottom: 0.5em;font-family: 'Asap', sans-serif;font-weight: bold;border-bottom: 1px solid #333;padding-bottom:0.3em; margin-bottom: 0.5em;}
#contCell.yado p{ color: #101010;font-size: 13px; line-height: 1.8em;margin: 0 0 3em; 0;}
#contCell.yado p.last{margin:0}
#contCell.yado .crm02 p{ margin-bottom: 1em;}

.yado .mvPhoto img{ width: 100%;}
#contCell.yado p.yadoTxt{ text-align: center; font-size: 130%; font-family: serif; margin-bottom: 50px;}

.yado .subPhoto img{ width: 100%;}
.yado .madori{ padding: 30px; text-align: center; box-sizing: border-box; background: #fff;}
.yado .madori img{ width: 90%;}


.yado .listBox{padding: 2em 2em 2em 4em; border: 1px solid #333; margin-bottom: 50px;}
.yado .listBox ul li{ position: relative; margin-bottom: 0.5em; line-height: 1.3em;}
.yado .listBox ul li:before{
    content: '●';
    color: #222;
    margin-right: 8px;
    position: absolute;
    left: -2em;
    top: 1px;
    font-size: 85%;
    display: block;
}




@media(max-width:750px){
#contCell.yado{ position: relative; top: -80px; padding-bottom: 0;}
#contCell.yado h2{ width: 260px; margin: 30px auto}
#contCell.yado h3{font-size: 36px; font-weight: normal;}
#contCell.yado p{ font-size: 28px; }
#contCell.yado p.last{margin:0}

#yadoh2area .instaicon{width: 120px; position: absolute; top: -100px; right:0;}
#yadoh2area .instaicon img{ width: 100%;}

.yado .madori{ padding: 20px; text-align: center; box-sizing: border-box; background: #fff;}
.yado .madori img{ width: 100%;}
}






.yado .dlTable {
    width: 100%; /* �?ーブルの横�?�?500pxに�?�? */
    display: flex; /* 子要�?のdtとddを横並びにする */
    flex-wrap: wrap; /* 1つのdtとddで1行になるよ�?改行させる */
    padding-bottom: 50px;
}
.yado .dlTable dt,
.yado .dlTable dd {
    box-sizing: border-box; /* widthの計算を楽にするため */
    padding-bottom: 6px;
font-style: normal;
}
.yado .dlTable dt {
    font-size: 16px; /* フォントサイズ�?16pxに�?�? */
    width: 110px; /* dt?��見�?�し�??目?���?�横�?�?200pxに�?�? */
    font-weight: bold;
}
.yado .dlTable dd {
    width: calc(100% - 110px); /* �?ーブル�?からdtを引いた�??の横�?を指定�? */
    font-size: 14px; /* フォントサイズ�?16pxに�?�? */
    line-height: 1.4em;
}

/* FOR smartphone landscape
***************************************************************************/
@media screen and (max-width:750px) {

.yado .dlTable {
        width: 100%; /* 横�?をpxではなく、�?�?っぱ�?に�?定�? */
        border-left: none; /* �?ーブルの左の線を消す */
        display: block; /* 横並びにさせな�?ようブロ�?ク要�?にする */
        margin-bottom: 30px;
    }
.yado .dlTable dt,
.yado .dlTable dd {
        border-right: none; /* セルの右の線を消す */
        width: 100%; /* 横�?を�?�?っぱ�?に�?�? */
        padding: 10px 0; /* �?セルに余白を取�? */
        text-align: left;
    }
.yado .dlTable dt {
        border-bottom: none; /* 下�?�線を消す?�?ddの下�?�線が残る?�? */
        padding-bottom: 0; /*ddとの距離を近づけるため�?0にする*/
    font-size: 30px; 
    }
.yado .dlTable dd {
    font-size: 20px; 
        padding-bottom: 20px;
    font-size: 26px; /* フォントサイズ�?16pxに�?�? */
    
    }

}
    
/* ---------------------------------------------------------------------------------
outline */

#contCell{margin: 0 40px;}

#contCell.outline{ width: auto; margin: 0 auto;}
#contCell.outline h2{ color: #715749; text-align: center; font-size: 28px; margin-bottom: 1em;font-family: 'Marcellus', serif; font-weight: normal;}
#contCell.outline p{ color: #101010; text-align: left; font-size: 13px; line-height: 1.8em;margin: 0 0 2em; 0;}

#contCell.outline p.last{margin:0}

.crm2Box{ width: 450px; display: table; margin: 0 auto;}
.crm2Box .crmbox{ width: 50%; display: table-cell;}
.crm2Box .crmbox img{ width: 100%}

.crm2Box .crm01{ padding-right: 30px; border-right: 1px solid #231815;}
.crm2Box .crm02{ padding-left: 30px;}

.crm2Box p{}
.crm2Box h3{ font-size: 18px; margin-bottom: 1em;}
.crm2Box dl{}
.crm2Box dt{ font-size: 13px; margin-bottom: 0em; line-height: 1em;}
.crm2Box dd{ font-size: 13px; margin-bottom: 1em; line-height: 1.5em;}


@media(max-width:750px){

#contCell{margin: 0 50px;padding: 180px 0}

#contCell.outline{}
#contCell.outline h2{font-size: 45px; font-weight: normal;}
#contCell.outline h3{font-size: 36px; font-weight: normal;}
#contCell.outline p{ font-size: 28px; }
#contCell.outline p.last{margin:0}
    
 .crm2Box{ width: auto; display: block; margin: 50px;}
.crm2Box .crmbox{ width: auto; display: block;}
.crm2Box .crm01{ padding-right: 0; border-right:none; margin-bottom: 90px;}
.crm2Box .crm02{ padding-left: 0;}

.crm2Box p{}
.crm2Box h3{ margin-bottom: 1em;}
.crm2Box dl{}
.crm2Box dt{ font-size: 30px; margin-bottom: 0.5em; line-height: 1em;}
.crm2Box dd{ font-size: 28px; margin-bottom: 1em; line-height: 1.5em;}

}



.cafe .mv img{ width: 100%;}
#contCell.cafe p.text{ text-align: center; padding: 30px 0}
#contCell.cafe p.text img{ width: 60%;}

.cafemenu img{width: 100%;}

.crm01 h3{ margin-bottom: 0 !important;}

.infoList{ border: none;  margin-bottom: 2em;}
.infoList li{ padding: 0.5em;  font-size: 86%; border-bottom: 1px dotted #999;}
.infoList li{ font-size: 85%; line-height: 1.6em}


@media(max-width:750px){

.infoList li{ font-size: 110%; line-height: 1.6em}

}

/* ---------------------------------------------------------------------------------
footer */

footer{ color: #fff; text-align: center;}
footer p{font-size: 80%; padding-top: 1em;font-family: 'Asap', sans-serif;}

@media(max-width:750px){


}


@media(min-width:751px){
}

.zeroMargin{ margin: 0 !important;padding:0 !important;}

.clear{ clear:both;}
.tac{ text-align:center !important;}

@media(min-width:751px){
.sp{ display:none !important;}
} /* Responsive End */

@media(max-width:750px){
.pc{ display:none !important; }
} /* Responsive End */

@media(max-width:750px){
.tac_pc{ text-align:left !important;}
.tac_sp{ text-align:center !important;}
}

@media(min-width:751px){
.tac_pc{ text-align:center !important;}
.tac_sp{ text-align:left !important;}
}