@charset"utf-8"; /*halto*/
@import url("./color.css");
@import url("./yakumono.css");


/* =============================================*/
/*                  固定指定部                     */
/* =============================================*/
#container{
  top:0vw;
  width:80vw;
  min-height:40vw;
  margin:0vw auto;
  overflow:hidden;
}
@media screen and (max-width: 1400px) {
  #container{
    top:0vw;
    width:95vw;
    min-height:80vw;
    margin:0vw 2.5vw;
    margin:0vw auto;
    overflow:hidden;
    background:rgba(255,255,255,0.5);
  }
}

/* =================Top Pageのみ==================*/
#top_page_title{
  font-size:4vw;
  font-weight:bold;
  color:#3e5dad;
  margin-top:calc(40vw / 2 - 4vw);
}
@media screen and (max-width: 999px) {
  #top_page_title{
    margin-top:calc(70vw / 2 - 4vw);
  }
}

/* ====================header=====================*/
@media screen and (min-width: 1000px) {
  #header{
    width:100%;
	height:5vw;
	background:url('../img/header_back_pc.jpg');
	background-size:100%;
  }	
}
@media screen and (max-width: 999px) {
  #header{
    width:100%;
	height:10vw;
	background:url('../img/header_back_s.jpg');
	background-size:100%;
  }		
}

/* ===================top menu====================*/
#top_menu_ber{
  width:100%;
  padding:1vw;
  background-color:#e6e6fa;
  margin-bottom:1vw;
}


@media screen and (min-width: 1000px) {
  #s_nemu_on{display:none;}
  #s_nemu_off{display:none;}
}
@media screen and (max-width: 999px) {
  #s_nemu_on{
    position:fixed;
    top:10px;
    right:10px;
    width:40px;
    height:40px;
    display:none;
    z-index:200;
  }
  #s_nemu_off{
    position:fixed;
    top:10px;
    right:10px;
    width:40px;
    height:40px;
    display:none;
    z-index:200;
  }
}
@media screen and (min-width: 1000px) {
  #menu{
   display:block;
  }
}
@media screen and (max-width: 999px) {
  #menu{
    position:fixed;
    top:12vw;
    left:0px;
    width:100%;
    height:83vh;
    padding:10px;
    background:rgba(0,0,0,0.5);
    overflow:hidden;
    z-index:100;
    display:none;
  }
}

/* ==================left_box=====================*/
@media screen and (min-width: 1000px) {
  #left_box{
    width:18vw;
    padding:10px;
    text-align:left;
    word-wrap: break-word;
    float:left;
    background:#f7f8f8;
    overflow:hidden;
  }
}
@media screen and (max-width: 999px) {
  #left_box{
    width:100%;
    padding:10px;
    text-align:left;
    word-wrap: break-word;
    background:#f7f8f8;
  }
}

#left_box li {
  margin-bottom:4px;
   width:100%;
}
#left_box li  a{
  border-left:4px solid #000879;
  padding:10px;
  color:#333;
  text-decoration:none;
  display:block;
  background:#d2ebf1;
}
#left_box li a:hover{
  padding:10px;
  color:#fff;
  display:block;
  border-left:4px solid #ccc;
  background:#000879;
  transition-property:background;
  transition-color:background;
  transition-duration:0.3s;
  transition-timing-function:ease-out;
  transition-delay:0.1s;
}

.ser_btn{
  width:20%;
  height:3vw;
  line-height:3vw;
  background:#000879;
  color:#fff;
  border-radius: 0px 6px 3px 0px;
}

/* ==================right_box=====================*/
@media screen and (min-width: 1000px) {
  #right_box{
    width:calc(100% - 18vw - 30px);
    float:right;
    text-align:left;
    background:#efefef;
    padding:10px;
    word-wrap: break-word;
  }
  #right_box .inner{
    min-height:600px;
  }
  .main_box{
    font-size:1.2vw;
    line-height:1.8em;
    margin-bottom:20px;
    font-family: "Sawarabi Mincho";
    word-wrap: break-word;
  }
}
@media screen and (max-width: 999px) {
  #right_box{
    width:100%;
    text-align:left;
    background:#f7f8f8;
    padding:10px;
    word-wrap: break-word;    
  }
  #right_box .inner{
    min-height:80vw;
  }
  .main_box{
    line-height:1.8em;
    margin-bottom:20px;
    font-family: "Sawarabi Mincho";
    word-wrap: break-word;
  }
}
#right_box a{
  color:#030984;
}
.main_box p{
  margin-bottom:20px;
}
.time_box{
  margin-bottom:20px;
  font-size:80%;
  text-align:right;
  padding-right:10vw;
}

#right_box .perger_box{
  margin:20px;
  display:flex;
  justify-content:center;
}
@media screen and (min-width: 1000px) {
  #right_box .peger_1coma{
    width:16%;
    height:36px;
    font-size:80%;
    text-align:center;
    line-height:36px;
    margin:0px 6px;
    overflow:hidden;
    border-radius:6px;
    color:#fff;
    background:#9fa0a0;  
  }
}
@media screen and (max-width: 999px) {
  #right_box .peger_1coma{
    width:30%;
    height:36px;
    font-size:80%;
    text-align:center;
    line-height:36px;
    margin:0px 6px;
    overflow:hidden;
    border-radius:6px;
    color:#fff;
    background:#9fa0a0;  
  }
}
#right_box .peger_1coma a{
  color:#fff;
  text-decoration:none;
  display:block;
  background:#000879;
}
#right_box .peger_1coma a:hover{
  color:#fff;
  text-decoration:none;
  background:#9fa0a0;  
}
.per_c{
   width:20%;
  padding:10px;
  font-size:80%;
  text-align:center;
  overflow:hidden;
}

/* ==================body最後=====================*/
@media screen and (min-width: 1000px) {
#goto_top{
  width:4vw;
  height:4vw;
  border-radius:2vw;
  position:fixed;
  right:40px;
  bottom:10px;
  background:#54c3f1;
  color:#fff;
  font-size:2vw;
  font-weight:bold;
  text-align:left;
  line-height:3.8vw;
  padding-left:0.6vw;
  transform: rotate(90deg);
  display:none;
  cursor:pointer;
}
}
@media screen and (max-width:999px) {
#goto_top{
  width:11.52vw;
  height:11.52vw;
  border-radius:5.76vw;
  position:fixed;
  right:10px;
  bottom:10px;
  background:#54c3f1;
  color:#fff;
  font-size:5.76vw;
  font-weight:bold;
  text-align:left;
  line-height:10.94vw;
  padding-left:1.728vw;
  transform: rotate(90deg);
  display:none;
}
}
@media screen and (min-width: 1000px) {
  #footer{
	width:80%;
    margin:0vw auto;
    text-align:center;
    font-size:80%;
    background-color:#231815;
    color:#ffffff;
    line-height:1em;
    padding:10px 0px;
    overflow:hidden;
  }
}
@media screen and (max-width: 999px) {
  #footer{
    width:95vw;
    margin:0vw 2.5vw;
    margin:0vw auto;
    text-align:center;
    font-size:80%;
    background-color:#231815;
    color:#ffffff;
    line-height:1.2em;
    padding:10px 0px;
    overflow:hidden;
  }
}
#footer a{
  color:#ffffff;
}

iframe {
  border: none;
}
  
td,th{
  vertical-align:top;
  padding:0.3vw;
}

p{margin:0px;
  box-sizing: border-box;
}

div{
  box-sizing: border-box;
}

ul{
  margin:0px;
  padding:0px;
}
ul,li{
  list-style:none;
}
ol,li{
  list-style:numlic;
}


img {border:0px;}
a:hover img{
  filter:alpha(opacity=50);
  -moz-opacity: 0.5;
  opacity: 0.5;
}
a:active img{
  filter:alpha(opacity=50);
  -moz-opacity: 0.5;
  opacity: 0.5;
}
a img{
  filter:alpha(opacity=100);
  -moz-opacity: 1;
  opacity: 1;
}

a{
  color:#333;
  text-decoration:none;
  font-weight:bold;
}

@media screen and (max-width: 999px) {
  .s{display:block;}
  .pc{display:none;}
}
@media screen and (min-width: 1000px) {
  .s{display:none;}
  .pc{display:block;}
}

body { 
  background : #fff;
  margin:0;
  text-align:center;
  color:#333;
  font-family: Verdana, Roboto, "Droid Sans", "メイリオ", Meiryo, "游ゴシック", YuGothic, "ヒラギノ角ゴ ProN", "Hiragino Kaku Gothic", sans-serif;
  line-height:1em;
  -webkit-text-size-adjust: 100%;
 }