@charset "UTF-8";
@import url(reset.css);
@import url(../../fonts.googleapis.com/earlyaccess/notosansjapanese.css);
@import url(http://fonts.googleapis.com/css?family=Tangerine);
/*-------------------Comment-----------------------*/
body{background:url(../images/bg.jpg);font-size:14px; color: #3f1f09;font-family: 'Noto Sans Japanese',Lucida Grande, Hiragino Kaku Gothic Pro, ヒラギノ角ゴ Pro W3, メイリオ, Meiryo, ＭＳ Ｐゴシック, Geneva, Arial, Verdana, sans-serif;	}

a:link{ text-decoration: none; color:#9f5e01;}
a:visited{color:#ac6b0d; }
a:hover{color:#ba6e01; text-decoration: underline;}
a:active{color:#ba6e01;}

.annotation{ font-size:11px; color:#423829;}
.stress1{color:#331e00; font-size:15px; font-weight: bolder;}

#container{width:995px; padding: 0 46px; margin: 0 auto; background: url(../images/containerBack.png) repeat-y; overflow: hidden;}
#header{width:995px;height: 256px; margin:0 auto; background:url(../images/header.jpg) no-repeat; position: relative;}
#logoA{width:306px;height:214px; display: block; position: absolute; left: 355px;top:5px;}
#telA{width:310px;height:65px; display: block; position: absolute; left:669px;top:63px;}

#middle{ width:971px;height:auto; margin:0 auto; padding:0 12px; overflow: hidden; background:url(../images/middleBack.jpg) repeat-y;}

#menu{ width:971px; height:50px; margin:5px auto; background:url(../images/menu.gif) no-repeat; overflow:hidden; text-indent:-9999px; position:relative;}

#menu1,#menu2,#menu3,#menu4,#menu5,#menu6,#menu7{ width:139px; height:50px; display:block; }
#menu1{ position:absolute; left:0px; top:0px;}
#menu1:hover{ background:url(../images/menu.gif) -0px -50px;}
#menu2{ position:absolute; left:139px; top:0px;}
#menu2:hover{ background:url(../images/menu.gif) -139px -50px;}
#menu3{ position:absolute; left:278px; top:0px;}
#menu3:hover{ background:url(../images/menu.gif) -278px -50px;}
#menu4{ position:absolute; left:417px; top:0px;}
#menu4:hover{ background:url(../images/menu.gif) -417px -50px;}
#menu5{ position:absolute; left:556px; top:0px;}
#menu5:hover{ background:url(../images/menu.gif) -556px -50px;}
#menu6{ position:absolute; left:695px; top:0px;}
#menu6:hover{ background:url(../images/menu.gif) -695px -50px;}
#menu7{width:137px; position:absolute; left:834px; top:0px;}
#menu7:hover{ background:url(../images/menu.gif) -834px -50px;}

#sidebar{width:320px; height: auto; float:left; overflow: hidden;}
#content{width:636px;height:auto; overflow: hidden; float: right; }
#contentB{width:860px;height:auto; overflow: hidden; margin:10px auto 25px; min-height:300px;}

#hotStaff{width:276px; height:414px;padding:23px;background:url(../images/hot.gif) no-repeat;  margin-bottom:10px;}

#footer{width:971px; min-height:185px; height:auto; margin:0 auto; position: relative; background:url(../images/footerBack.png) no-repeat; text-align:center; position: relative; }
#footerMenu{width:971px;height:35px;line-height:35px; text-align:center;}
#footerMenu a{text-decoration:none;font-size:14px;}
#footer a:hover{text-decoration:underline;color:#eab51b;}
#footerTelA{width:290px;height:40px;position: absolute; top:70px; left: 730px;}
#annotationItem{width: 600px;height:80px; position: absolute; left:25px;bottom:50px; text-align: left;}

#copyright{ height: auto; min-height:40px; margin:0; padding:0 10px; background: #eddbc6; line-height: 40px; font-size: 12px; text-align:right;}

/*---------------Index.php---------------*/
#campaign{width: 690px;overflow: hidden;margin-bottom: 15px;}
#newMessage{width:636px;height:424px; background:url(../images/newMessage.jpg) no-repeat; margin-bottom: 10px; position:relative;}
#newMessageC{width:591px;height:336px; position:absolute; left:22px; top:66px; overflow-y:auto; overflow-x:hidden;}
.newMessageTitle{font-size: 22px; color:#402a01;}
.date{font-size: 14px; color:#938365; margin-bottom: 10px;}
.message{margin-bottom: 15px; padding-bottom:15px; font-size:14px; border-bottom:1px dotted #938365;}

/*------------------ Staff ---------------------*/
.staffDiv{width:260px; height:400px; margin:0 5px 40px 20px; float:left; position: relative;background: url(../images/staffFrame.gif) no-repeat;}
.staffDiv .staffImg{width:248px; padding: 6px;}

.wordSpan{height:40px; line-height:40px; text-align:center;}
.wordSpan a{ text-decoration: none; font-size:17px;}
.wordSpan a:hover{text-decoration: underline;}

#container{
    width:995px;
    padding: 0 46px;
    margin: 0 auto;
    background: url(../images/containerBack.png) repeat-y;
    overflow: visible;
}

.accessPage .accessMapBox{
    width:850px;
    height:600px;
    margin:0 auto;
}

.accessPage .accessMapBox iframe{
    width:100% !important;
    height:100% !important;
    border:0 !important;
    display:block !important;
}

@media screen and (max-width:768px){

html,body{
    margin:0 !important;
    padding:0 !important;
    overflow-x:hidden !important;
}

#container,
#middle{
    width:100% !important;
    max-width:100% !important;
    padding:0 !important;
    margin:0 auto !important;
    overflow:visible !important;
    background-size:100% auto !important;
}

#header{
    width:100% !important;
    height:0 !important;
    padding-top:25.7% !important;
    background:url(../images/header.jpg) no-repeat center top !important;
    background-size:100% auto !important;
    position:relative !important;
}

#logoA{
    width:30% !important;
    height:70% !important;
    left:35% !important;
    top:2% !important;
}

#telA{
    width:32% !important;
    height:18% !important;
    left:67% !important;
    top:24% !important;
}

#menu{
    position:relative !important;
    width:100% !important;
    height:0 !important;
    padding-top:5.15% !important;
    margin:5px auto 0 !important;
    overflow:hidden !important;
    background:url(../images/menu.gif) no-repeat center top !important;
    background-size:100% auto !important;
    text-indent:-9999px !important;
}

#menu1,#menu2,#menu3,#menu4,#menu5,#menu6,#menu7{
    position:absolute !important;
    top:0 !important;
    height:100% !important;
    display:block !important;
    background:none !important;
}

#menu1:hover,#menu2:hover,#menu3:hover,#menu4:hover,#menu5:hover,#menu6:hover,#menu7:hover{
    background:none !important;
}

#menu1{left:0 !important;width:14.28% !important;}
#menu2{left:14.28% !important;width:14.28% !important;}
#menu3{left:28.56% !important;width:14.28% !important;}
#menu4{left:42.84% !important;width:14.28% !important;}
#menu5{left:57.12% !important;width:14.28% !important;}
#menu6{left:71.4% !important;width:14.28% !important;}
#menu7{left:85.68% !important;width:14.32% !important;}

#contentB{
    width:100% !important;
    max-width:100% !important;
    min-height:0 !important;
    margin:10px auto 0 !important;
    padding:0 !important;
    overflow:visible !important;
    box-sizing:border-box !important;
}

#footer{
    width:100% !important;
    height:auto !important;
    min-height:0 !important;
    margin:0 auto !important;
    padding:0 !important;
    background:url(../images/footerBack.png) no-repeat center top !important;
    background-size:100% auto !important;
}

#footerMenu{
    width:100% !important;
    height:auto !important;
    line-height:1.6 !important;
    padding:5px 0 !important;
}

#annotationItem{
    position:static !important;
    width:90% !important;
    height:auto !important;
    margin:0 auto !important;
    padding:5px 0 !important;
    text-align:left !important;
}

#annotationItem p{
    margin:0 !important;
    padding:2px 0 !important;
}

#footerTelA{
    display:none !important;
}

#copyright{
    width:100% !important;
    height:auto !important;
    min-height:0 !important;
    margin:0 !important;
    padding:5px 10px !important;
    line-height:1.5 !important;
    box-sizing:border-box !important;
    text-align:center !important;
}

/* TOPページだけ */
.topPage #sidebar,
.topPage #content,
.topPage #campaign,
.topPage #newMessage,
.topPage #newMessageC{
    width:100% !important;
    max-width:100% !important;
    float:none !important;
    box-sizing:border-box !important;
}

.topPage #campaign img{
    max-width:100% !important;
    height:auto !important;
}

.topPage #newMessage{
    height:auto !important;
    min-height:0 !important;
    padding:5px 0 !important;
    background-size:100% auto !important;
}

.topPage #newMessageC{
    position:static !important;
    width:95% !important;
    height:auto !important;
    margin:0 auto !important;
}

.topPage #newMessageC iframe{
    width:100% !important;
    height:210px !important;
    display:block !important;
    border:0 !important;
}

.topPage #slider1{
    width:100% !important;
    height:31vw !important;
    min-height:120px !important;
    max-height:310px !important;
    margin:0 auto 10px !important;
    overflow:hidden !important;
    position:relative !important;
    background:#fff !important;
}

.topPage #slider1Content{
    width:100% !important;
    height:100% !important;
    margin:0 !important;
    padding:0 !important;
    position:relative !important;
}

.topPage #slider1 .slider1Image{
    position:absolute !important;
    top:0 !important;
    left:0 !important;
    width:100% !important;
    height:100% !important;
    margin:0 !important;
    padding:0 !important;
    overflow:hidden !important;
}

.topPage #slider1 .slider1Image img{
    width:100% !important;
    height:100% !important;
    object-fit:cover !important;
    display:block !important;
}

.topPage .bottom1{
    display:none !important;
}

.topPage #hotStaff{
    width:100% !important;
    height:auto !important;
    padding:0 !important;
    background:none !important;
}

.topPage #slider2,
.topPage #slider2Content,
.topPage .slider2Image{
    width:100% !important;
    height:auto !important;
    overflow:hidden !important;
}

.topPage .slider2Image img{
    width:100% !important;
    height:auto !important;
    display:block !important;
}

.topPage #sliderLineWrapper{
    display:none !important;
}

/* STAFFページだけ */
.staffPage #contentB{
    display:flex !important;
    flex-wrap:wrap !important;
    justify-content:space-between !important;
}

.staffPage .staffDiv{
    float:none !important;
    width:49% !important;
    margin:0 0 15px 0 !important;
    padding:0 !important;
    height:auto !important;
    overflow:hidden !important;
    box-sizing:border-box !important;
    background-size:100% 100% !important;
}

.staffPage .staffDiv .staffImg{
    width:100% !important;
    height:220px !important;
    object-fit:cover !important;
    object-position:center top !important;
    padding:0 !important;
    display:block !important;
}

.staffPage .wordSpan{
    height:auto !important;
    line-height:1.4 !important;
    font-size:12px !important;
    padding:5px 0 !important;
    text-align:center !important;
}

.staffPage .wordSpan a{
    font-size:13px !important;
}

.staffPage .wordSpan img,
.staffPage img[src*="new2.gif"]{
    width:14px !important;
    max-width:14px !important;
    height:auto !important;
    display:inline-block !important;
    vertical-align:middle !important;
}

/* PROFILEページだけ */
.profilePage #name{
    font-size:20px !important;
    margin:10px 0 !important;
    text-align:center !important;
}

.profilePage #name img{
    width:14px !important;
    max-width:14px !important;
    height:auto !important;
    display:inline-block !important;
    vertical-align:middle !important;
}

.profilePage #staffFrameBig{
    width:90% !important;
    height:auto !important;
    margin:0 auto 15px !important;
    float:none !important;
    background-size:100% 100% !important;
}

.profilePage .staffImgBig{
    width:100% !important;
    height:auto !important;
    padding:3% !important;
    box-sizing:border-box !important;
    display:block !important;
}

.profilePage #profileDiv{
    width:95% !important;
    float:none !important;
    margin:0 auto !important;
}

.profilePage .profile,
.profilePage .thumbImgDiv{
    width:100% !important;
    box-sizing:border-box !important;
    padding:8px !important;
    margin-bottom:15px !important;
}

.profilePage .profileTitle{
    width:100% !important;
    box-sizing:border-box !important;
}

.profilePage #profileTable{
    width:100% !important;
}

.profilePage #profileTable td{
    font-size:14px !important;
}

.profilePage #comment{
    font-size:14px !important;
    line-height:1.7 !important;
}

.profilePage .thumbImgDiv img{
    width:60px !important;
    height:60px !important;
    object-fit:cover !important;
}

.profilePage .imgHover{
    width:70% !important;
    max-width:260px !important;
    height:auto !important;
}

.profilePage #sliderLineWrapper{
    display:none !important;
}

/* ACCESSページだけ */
.accessPage #table1{
    width:95% !important;
    max-width:95% !important;
    table-layout:fixed !important;
    word-break:break-word !important;
}

.accessPage #table1 td{
    font-size:14px !important;
    padding:8px 5px !important;
}

.accessPage #table1 .titleTd{
    width:30% !important;
    font-size:14px !important;
}

.accessPage .accessMapBox{
    width:95% !important;
    height:320px !important;
    margin:0 auto !important;
}

.accessPage .accessMapBox iframe{
    width:100% !important;
    height:100% !important;
    display:block !important;
    border:0 !important;
}

/* =========================
   TOP PAGE slider1 修正版
========================= */

.topPage #slider1{
        width:100% !important;
        height:32vw !important;
        min-height:120px !important;
        max-height:310px !important;
        overflow:hidden !important;
        position:relative !important;
        background:#fff !important;
    }

    .topPage #slider1Content{
        width:200% !important;
        height:100% !important;
        margin:0 !important;
        padding:0 !important;
        display:flex !important;
        animation:topSlider 8s infinite;
    }

    .topPage #slider1Content .slider1Image{
        width:50% !important;
        height:100% !important;
        display:block !important;
        position:relative !important;
        list-style:none !important;
    }

    .topPage #slider1Content .slider1Image img{
        width:100% !important;
        height:100% !important;
        object-fit:cover !important;
        display:block !important;
    }

    .topPage #slider1Content .clear{
        display:none !important;
    }

    .topPage #slider1 .bottom1{
        display:none !important;
    }

    @keyframes topSlider{
        0%{transform:translateX(0);}
        45%{transform:translateX(0);}
        50%{transform:translateX(-50%);}
        95%{transform:translateX(-50%);}
        100%{transform:translateX(0);}
    }
    
    /* RECRUITページだけ */

.recruitPage #contentB{
    width:100% !important;
    max-width:100% !important;
    min-height:0 !important;
    margin:10px auto 0 !important;
    padding:0 !important;
    overflow:visible !important;
    box-sizing:border-box !important;
}

.recruitPage #contentB center{
    display:block !important;
    width:100% !important;
}

.recruitPage #contentB img{
    width:95% !important;
    max-width:95% !important;
    height:auto !important;
    display:block !important;
    margin:0 auto !important;
}

/* =========================
   LINKページ専用
========================= */

.linkPage #contentB{
    width:95% !important;
    margin:10px auto !important;
    padding:0 !important;
    display:block !important;
}

.linkPage #contentB p{
    text-align:center !important;
    line-height:2 !important;
}

.linkPage #contentB a{
    display:block !important;
    margin-bottom:15px !important;
    font-size:14px !important;
    word-break:break-all !important;
}

.linkPage #contentB img{
    width:150px !important;
    max-width:80% !important;
    height:auto !important;
    display:block !important;
    margin:0 auto 8px !important;
}

/* SYSTEMページ専用 */

.systemPage #contentB{
    width:100% !important;
    max-width:100% !important;
    margin:10px auto 0 !important;
    padding:0 !important;
    display:block !important;
}

.systemPage #contentB p{
    margin:0 !important;
    padding:0 !important;
    text-align:center !important;
}

.systemPage #contentB img{
    width:95% !important;
    max-width:95% !important;
    height:auto !important;
    display:block !important;
    margin:0 auto !important;
}

/* GALLERYページ専用 */

.galleryPage #contentB{
    width:100% !important;
    max-width:100% !important;
    margin:10px auto 0 !important;
    padding:0 !important;
    display:block !important;
}

.galleryPage #gallery{
    width:95% !important;
    height:320px !important;
    display:block !important;
    margin:0 auto !important;
    border:0 !important;
}

}