@charset "utf-8";

/* ##### グローバルここから ##### */
#header {
    width: 100%;
    height: auto;
}
/* ボックスの上下 */
.boxA {

}



.boxA .boxA-inner .box1 {
    float: left;
    width: 32%;

}

.boxA .boxA-inner .box_tel {
    width: 68%;
    float: left;
    margin-bottom: 2.5rem;
}





.boxA-inner .box_tel img {
    float: right;
    margin-top: 0.7rem;
    margin-right: 3%;

}
.boxA-inner .box_tel .mail_b {
    background-color: #000000;
    padding-left: 4%;
    padding-right: 5%;
    margin-top: 1rem;
    float: right;
    padding-top: 0.8rem;
    padding-bottom: 0.3rem;
}
.box_tel .mail_b img {
    margin-right: 0.5rem;
    margin-top: 0px;
    margin-left: 0px;
    float: left;
}

.box_tel .mail_b p {
    color: #FFFFFF;
    float: left;
    line-height: 1em;
    text-align: justify;
}
.mail_b p a {
    color: #FFFFFF;
    text-decoration: none;
}
.mail_b p a:hover  {
    color: #FFFF00;
    text-decoration: none;
}

.boxA .boxA-inner .pc_menu {
    width: 68%;
    float: left;
    margin-bottom: 0.2rem;
}
.boxA-inner .pc_menu ul {
    width: 100%;
    display: inline;


}
.pc_menu ul li {
    float: left;
    text-align: center;
    width: 20%;
    height: auto;
    font-size: 1.4rem;
}
.pc_menu ul li a  {
    text-decoration: none;
    color: #000000;
    display: block;
    padding-top: 1rem;
    padding-bottom: 1rem;

}
.pc_menu ul li a:hover  {
    background-color: #004DA0;
    color: #FFFFFF;
    display: block;
}
.site img {
    border: none;
    padding-bottom: 0px;
    display: block;
}





.boxA-inner .box2 #menu {


}
.site a img {
}

#main .to_top {
    width: 100%;
}
#main .to_top img {
    float: right;
}
#main #page-top  {
    position: fixed;
    bottom: 30px;
    right: 15px;
    display: block;
}
#main #page-top a {
    display: block;
    background-color: #ccc;
    text-align: center;
    color: #222;
    font-size: 25px;
    text-decoration: none;
    padding-top: 10px;
    padding-right: 12px;
    padding-left: 12px;
    padding-bottom: 10px;
    filter: alpha(opacity=50);
    -moz-opacity: 0.5;
    border-radius: 4px;
    opacity: 0.5;
}
#main #page-top a:hover {
    display: block;
    background-color: #b2d1fb;
    text-align: center;
    color: #fff;
    font-size: 25px;
    text-decoration: none;
    padding-top: 10px;
    padding-right: 12px;
    padding-left: 12px;
    padding-bottom: 10px;
    filter: alpha(opacity=50);
    -moz-opacity: 0.5;
    border-radius: 4px;
    opacity: 0.5;
}








/* ########### 767px以下 ########### */
@media (max-width: 767px) {
html {
    font-size: 0.55rem;
}
/* ##### ヘッダーここから ##### */
#header {
    width: 100%;
    height: auto;
}
#header .boxA .boxA-inner {
    position: relative;

}
.boxA .boxA-inner .box1 {
    position: absolute;
    left: 1%;
    top: 0.5rem;
}
#main .slide_a .sa_tasp {
    display: block;
}
.site a img {
    width: 80%;
    height: auto;
    padding-top: 0.5rem;
    padding-left: 3%;
}
.boxA-inner .box1 .site {
}
.boxA .boxA-inner .box_tel {
    display: none;
}
.boxA-inner .box2 #menu {
    display: none;
}
.boxA .boxA-inner .pc_menu {
    display: none;

}


/*---------------------------------------------
  Hamburger Navigation
  ---------------------------------------------*/
.hamburger-nav-toggle-btn {
    float: right;
    background-color: #FFFFFF;
    padding-top: 1.2rem;
    padding-right: 1.2rem;
    padding-bottom: 1.2rem;
    padding-left: 1.2rem;
    border: 1px solid #C0C0C0;
    border-radius: 3px;
    margin-bottom: 2.5rem;
    margin-left: 3%;
    margin-right: 3%;
    margin-top: 2.2rem;
}
.hamburger-nav-toggle-btn.close::before, .hamburger-nav-toggle-btn.open::before {
    font-size: 18px;
    font-weight: 600;
    font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
}
.hamburger-nav-toggle-btn.open::before {
    content: 'close';
    margin-left: 3px;
    margin-right: 3px;
}
.hamburger-nav-toggle-btn.close::before {
    content: 'menu';
}
.hamburger-nav-list {
    list-style: none;
    background-color: #0068B2;
    clear: both;
    display: none;
}
.hamburger-nav-list > li {
    border-bottom: 1px solid #eeeeee;
}
.hamburger-nav-list > li a {
    display: block;
    padding-top: 1.5rem;
    padding-right: 1.5rem;
    padding-left: 1.5rem;
    padding-bottom: 1.5rem;
    color: #FFFFFF;
    text-decoration: none;
    background-color: #0068B2;
}
.hamburger-nav-list li a:hover  {
    background-color: #004576;
}
.boxA-inner .box1 .site {
    width: 210px;
    height: auto;
}


/* ##### SPページトップへ ##### */	
#page-top {
    position: fixed;
    bottom: 30px;
    right: 15px;
    display: block;
} 
#page-top a {
    display: block;
    background-color: #ccc;
    text-align: center;
    color: #222;
    font-size: 25px;
    text-decoration: none;
    padding-top: 3px;
    padding-right: 12px;
    padding-left: 12px;
    padding-bottom: 3px;
    filter: alpha(opacity=50);
    -moz-opacity: 0.5;
    opacity: 0.5;
    border-radius: 4px;
} 
#page-top a:hover {
    display: block;
    background-color: #b2d1fb;
    text-align: center;
    color: #fff;
    font-size: 25px;
    text-decoration: none;
    padding-top: 3px;
    padding-right: 12px;
    padding-left: 12px;
    padding-bottom: 3px;
    filter: alpha(opacity=50);
    -moz-opacity: 0.5;
    opacity: 0.5;
    border-radius: 4px;
} 
#advance {
    display: block;
    margin-top: -400px;
    padding-top: 400px;
}
#pamphlet {
    display: block;
    margin-top: -400px;
    padding-top: 400px;
}
#homepage {
    display: block;
    margin-top: -400px;
    padding-top: 400px;
}
#pr_movie {
    margin-top: -400px;
    padding-top: 400px;
    display: block;
}












/* ##### SPページトップへここまで ##### */
}

/* ########### 768px～959px ########### */
@media (min-width:768px) and (max-width:976px){
html {
    font-size: 0.6rem;
}
	
/* ##### TAヘッダーここから##### */
#header .hamburger-nav {
    display: none;
}
	
.boxA {
    padding-top: 0px;
    padding-bottom: 10px;
    width: 98%;
    margin-left: auto;
    margin-right: auto;
    padding-right: 1%;
    padding-left: 1%;
}
/* BOX1とBOX2を横に並べる設定 */
.boxA:after {
    content: "";
    display: block;
    clear: both
}
.boxA .boxA-inner .box1 {
    margin-bottom: 0px;
    margin-top: 1.5rem;
}
.box1 {
    float: left;
    width: auto
}
.box2 {
    float: right;
    width: auto
}

/* ナビゲーション */
#menu {
    display: block !important;
}
.menu ul {
    margin: 0;
    padding: 0;
    list-style: none;
    background-repeat: no-repeat;
}
#menu ul .tel {
    display: none;
}
.menu li {
    float: left;
    width: auto;
}
.menu li a {
    display: block;
    padding-right: 7px;
    padding-left: 7px;
    color: #000000;
    font-size: 14px;
    text-decoration: none;
    padding-top: 0px;
}
.menu li a:hover {
    background-color: #eeeeee
}
.menu ul:after {
    content: "";
    display: block;
    clear: both
}
.pc_menu ul li {
    text-align: center;
    font-size: 1.3rem;
}



}

/* ########### 960px以上 ########### */
@media (min-width:977px){
#header .boxA {
    width: 930px;
    padding-left: 15px;
    padding-right: 15px;
}
#header .hamburger-nav {
    display: none;
}
.boxA {
    padding-top: 0px;
    padding-bottom: 10px;
    padding-left: 15px;
    padding-right: 15px;
    width: 930px;
    margin-left: auto;
    margin-right: auto;
}

/* BOX1とBOX2を横に並べる設定 */
.boxA:after	{content: "";
	display: block;
	clear: both}

.box1	{float: left;
	width: auto
	}

.box2	{float: right;
	width: auto
	}

.boxA .boxA-inner .box1 {
    margin-top: 1.5rem;
}
	
	
/* ##### PCメインここまで##### */	
}
