@charset "utf-8";
/* firstview */

#header {
  position: static;
}
#header .headerWrap {
    width: 950px;
    margin: 0 auto;
    padding-left: 0px;
}

#header .headerAbout {
    display: flex
;
    justify-content: space-between;
    background-color: #231815;
    color: #fff;
    align-items: center;
     padding: 0px; 
    width: 950px;
    margin: 0 auto;
}

#header .headerAbout p{padding: 0em}

.hgk_foot {
    margin: 15px auto;
    background-color: #333;
    padding: 6px;
    color: #fff;
    width: 950px;
}

#firstview .firstviewInner{position:relative;height: 345px;overflow:hidden;width: 950px;margin: 0 auto;}
#firstview .firstviewInner .bgImg{position:absolute;top:0;left:0;bottom:0;right:0;opacity:0;animation:image-switch-animation 30s infinite; background-position: center;}
#firstview .firstviewInner .src1 {
    background-image : url(../images/back01_2505_rakuten.jpg);
}
#firstview .firstviewInner .src2 {
    background-image : url(../images/back02_rakuten.jpg);
    animation-delay  : 5s;
}
#firstview .firstviewInner .src3 {
    background-image : url(../images/back03_rakuten.jpg);
    animation-delay  : 10s;
}
#firstview .firstviewInner .src4 {
    background-image : url(../images/back04_rakuten.jpg);
    animation-delay  : 15s;
}
#firstview .firstviewInner .src5 {
    background-image : url(../images/back05_rakuten.jpg);
    animation-delay  : 20s;
    /* width: 950px; */
    height
Specifies the height of the content area, padding area or border area (depending on 'box-sizing') of certain boxes.
詳細
表示しない
: 363px;
}
#firstview .firstviewInner .src6 {
    background-image : url(../images/back06_rakuten.jpg);
    animation-delay  : 25s;
    /* width: 950px; */
    /* height: 363px; */
}

@keyframes image-switch-animation {
    0%{ opacity: 0;}
    5%{ opacity: 1;}
    25%{ opacity: 1;}
    30%{ opacity: 0;}
    100%{ opacity: 0;}
}

/* resSec */
#resSec{font-size: 18px;}
#resSec .resInner .resBox{background-color:#F9F9F8;border: 1px solid #887E70;margin-bottom: 1em; padding: 1em 2em;}
#resSec .resInner .resWrap{display: flex;align-items: center;font-size: 0.8em;}
#resSec .resInner .resWrap form{display: flex;}
#resSec .resInner .resWrap input{padding-left: 1em;}
#resSec .resInner .resWrap select{border: none;background: none;padding-left: 1em;cursor: pointer;}
#resSec .resInner .resWrap .resCheckIn input{border: none;background: none;}
#resSec .resInner .resWrap .resBorder{border-right: 1px solid #3E3A39;padding-right: 1.2em;padding-left: 1.2em;}
#resSec .resInner .resWrap .resBorder:last-child{border: none;padding-right: 0;}
#resSec .resInner .resWrap .resBorder p{line-height: 1.6;padding: 0;}
#resSec .resInner .resWrap .resSearch input{margin-left: 2.5em; padding: 0.5em 1em;color: #fff;background-color: #625b55;border: 2px solid #C9CACA;transition: ease .3s;cursor: pointer;}
#resSec .resInner .resWrap .resSearch input:hover{background-color: #fff;color: #625b55;}
#resSec .resInner .resWrap .resTitle{display: flex;align-items: center;justify-content: space-between;}
#resSec .resInner .resWrap .resTitle p{margin-left: 1em;}
#resSec .resInner .resBtn{display: flex;justify-content: space-between;}
#resSec .resInner .resBtn a{text-align: center;color: #fff;width: 25%;padding: 0.6em 1em;border: 2px solid #C9CACA;font-weight:lighter;transition: ease .3s;position: relative;}
#resSec .resInner .resBtn a::after{content: "";margin: auto;position: absolute;top: 0;bottom: 0;right: 18px;width: 8px;height: 8px;border-top: 2px solid #fff;border-right: 2px solid #fff;transform: rotate(45deg);}
#resSec .resInner .resBtn a:hover{background-color: #fff;}
#resSec .resInner .resBtn .btnColor1:hover{color:#8B6411;}
#resSec .resInner .resBtn .btnColor1:hover::after{border-top: 2px solid #8B6411;border-right: 2px solid #8B6411;}
#resSec .resInner .resBtn .btnColor2:hover{color:#887E70;}
#resSec .resInner .resBtn .btnColor2:hover::after{border-top: 2px solid #887E70;border-right: 2px solid #887E70;}
#resSec .resInner .resBtn .btnColor3:hover{color:#5E6B80;}
#resSec .resInner .resBtn .btnColor3:hover::after{border-top: 2px solid #5E6B80;border-right: 2px solid #5E6B80;}
#resSec .resInner .resAbout{position: relative;margin-top: 2em;font-size: 16px;}
#resSec .resInner .resAbout .resText{position: absolute;color: #fff; background-color: rgba(0, 0, 0, 0.6);font-weight: lighter;padding: 0.5em 2em;top: 20%;transform: translateY(-30%);left: 50%;transform: translateX(-50%);}
#resSec .resInner .resAbout .resTextTitle{font-size: 1.5em;text-align: center;}
#resSec .resInner .resAbout .resTextSmall{font-size: 0.8em;text-align: center;}
#resSec .resInner .resAbout .resTextSmall span{border: 1px solid #fff;padding: 0.2em 0.4em;}
#resSec .resInner .resAbout .resTextBig{font-size: 1em;text-align: center;}
#resSec .resInner .resAbout .resTextBig span{font-size: 1.5em;}

/* bestSec */
#bestSec{background-color:#EBE6DC;width: 950px;margin: 0 auto;}
#bestSec .bestBox .bestInfo{width: 90%;margin: 0 auto 6em;text-align: center;}
#bestSec .bestBox .bestInfo a{display: block;margin: 0 auto;}
#bestSec .bestBox .bestInfo a img{margin: 0 auto;}
/* #bestSec .bestBox .bestInfo{display: flex;justify-content: space-between;} */
/* #bestSec .bestBox .bestInfo a{width: 18%;} */
/* #bestSec .bestBox .bestInfo img{width: 100%;} */
#bestSec .bestBtn{display: flex;justify-content: space-evenly;margin-top: 2em;font-size: 18px;}
#bestSec .bestBtn a{background-color: #A5A111; text-align: center;color: #fff;width: 25%;padding: 0.6em 1em;border: 2px solid #C9CACA;font-weight:lighter;transition: ease .3s;position: relative;}
#bestSec .bestBtn a:hover{background-color: #fff;color: #A5A111;}
#bestSec .bestBtn a::after{content: "";margin: auto;position: absolute;top: 0;bottom: 0;right: 18px;width: 8px;height: 8px;border-top: 2px solid #fff;border-right: 2px solid #fff;transform: rotate(45deg);}
#bestSec .bestBtn a:hover::after{border-top: 2px solid #A5A111;border-right: 2px solid #A5A111;}

/* planSec */
#planSec .planBox .planFlex{display: flex;justify-content: center;flex-wrap: wrap;margin-bottom: 0em;}
#planSec .planBox .planFlex:last-child{margin-bottom: 0;}
#planSec .planBox .planFlex a{position: relative;overflow: hidden;width: 24%;margin: 0.3em;}
#planSec .planBox .planFlex a img{transition: ease .3s;width: 100%;}
#planSec .planBox .planFlex a:hover img{transform:scale(1.3);object-fit: cover;}
#planSec .planBox .planFlex p{position: absolute; background-color: rgba(35, 24, 21, 0.7);color: #fff;width: 95%;padding-left: 0.9em; bottom: 0 ;}
#planSec .planBox .planFlex p::after{content: "";margin: auto;position: absolute;top: 0;bottom: 0;right: 18px;width: 8px;height: 8px;border-top: 2px solid #fff;border-right: 2px solid #fff;transform: rotate(45deg);}

/* guideSec */
#guideSec{background-color:#EBE6DC ;}
#guideSec .guideFlex{display: flex;margin-bottom: 2em;justify-content: center;}
#guideSec .guideFlex:last-child{margin-bottom: 0;}
#guideSec .guideFlex a{margin-right: 1em;width: 30%;color: #0c0c0c;}
#guideSec .guideFlex a p{position: relative;margin-top: 0.5em;padding: 0;}
#guideSec .guideFlex a:hover{text-decoration: underline;}
#guideSec .guideFlex a p::after{content: "";margin: auto;position: absolute;top: 0;bottom: 0;right: 8px;width: 6px;height: 6px;border-top: 2px solid #0c0c0c;border-right: 2px solid #0c0c0c;transform: rotate(45deg);}
#guideSec .guideFlex a:last-child{margin-right: 0;}
#guideSec .guideFlex a img{width: 100%;transition: ease .3s;}
#guideSec .guideFlex a:hover img{opacity: 0.5;}

/* infoSec */
#infoSec h3{font-size: 2em;border-bottom: 1px solid #0c0c0c;margin-bottom: 1em;}
#infoSec .infoFlex{display: flex;justify-content: space-between;align-items: flex-start;}
#infoSec .infoFlex img{width: 46%;}
#infoSec .infoNews{width: 48%;}
#infoSec .infoNews ul li{display: flex;margin-bottom: 1em;}
#infoSec .infoNews a{color: #0c0c0c;text-decoration: underline;transition: ease .3s;}
#infoSec .infoNews a:hover{opacity: 0.5;}
#infoSec .infoNews ul li p:first-child{font-weight: bold;}
#infoSec .infoNews ul li p:last-child{margin-left: 1em;}
#infoSec .infoBtn{display: flex;justify-content: space-evenly;margin-top: 2em;font-size: 18px;}
#infoSec .infoBtn a{background-color: #A5A111; text-align: center;color: #fff;width: 25%;padding: 0.6em 1em;border: 2px solid #C9CACA;font-weight:lighter;transition: ease .3s;position: relative;}
#infoSec .infoBtn a:hover{background-color: #fff;color: #A5A111;}
#infoSec .infoBtn a::after{content: "";margin: auto;position: absolute;top: 0;bottom: 0;right: 18px;width: 8px;height: 8px;border-top: 2px solid #fff;border-right: 2px solid #fff;transform: rotate(45deg);}
#infoSec .infoBtn a:hover::after{border-top: 2px solid #A5A111;border-right: 2px solid #A5A111;}

/* planbtnSec*/
#planbtnSec{background-color:#EBE6DC ;font-size: 18px;}
#planbtnSec .planbtnInner{display: flex;justify-content: space-between;}
#planbtnSec .planbtnInner a{text-align: center;color: #fff;width: 25%;padding: 0.6em 1em;border: 2px solid #C9CACA;font-weight:lighter;transition: ease .3s;position: relative;}
#planbtnSec .planbtnInner a::after{content: "";margin: auto;position: absolute;top: 0;bottom: 0;right: 18px;width: 8px;height: 8px;border-top: 2px solid #fff;border-right: 2px solid #fff;transform: rotate(45deg);}
#planbtnSec .planbtnInner a:hover{background-color: #fff;}
#planbtnSec .planbtnInner .btnColor1:hover{color:#8B6411;}
#planbtnSec .planbtnInner .btnColor1:hover::after{border-top: 2px solid #8B6411;border-right: 2px solid #8B6411;}
#planbtnSec .planbtnInner .btnColor2:hover{color:#887E70;}
#planbtnSec .planbtnInner .btnColor2:hover::after{border-top: 2px solid #887E70;border-right: 2px solid #887E70;}
#planbtnSec .planbtnInner .btnColor3:hover{color:#5E6B80;}
#planbtnSec .planbtnInner .btnColor3:hover::after{border-top: 2px solid #5E6B80;border-right: 2px solid #5E6B80;}