@charset"utf-8";
/*SESSON-2*/

/* position:fixed;
   position:relative;
   position: absolute;
@media screen and (max-width:599px){}
@media screen and (max-width:599px){}
*/

/* ------------------------->タイトル*/
@media screen and (min-width:600px){
.title1{
 color:#00a0e9;
 border-left:4px solid #00a0e9;
 padding:20px 10px;
 font-size:140%;
 font-family: "Times New Roman";
}
}

/* ------------------------->区切り*/
.separator_10{
 width:100%;
 height:10px;
 border-bottom:1px dotted #64554D;
 margin-bottom:10px;
}


/* ------------------------->ボックス*/
.full_box{
 width:100%;
}

@media screen and (min-width:600px){
.cont_1_3_box_k{
 position:relative;
 width:calc( (80vw / 3) - 2px );
 height:calc( (80vw / 3) - 2px );
 padding:20px;
 line-height:1.5em;
 text-align:left;
 border:1px solid #231815;
 overflow:hidden;
 float:left;
}
.cont_1_3_box{
 position:relative;
 width:calc( (80vw / 3) - 2px );
 height:calc( (80vw / 3) - 2px );
 float:left;
 overflow:hidden;
 background:rgba(0,0,0,0.3);
 border:1px dotted #fff;
}
.cont_1_3_box img{
 width:100;
 filter:alpha(opacity=0);
  -moz-opacity: 0;
  opacity: 0;
}
.cont_1_3_box:hover img{
  z-index:200;
  filter:alpha(opacity=1);
  -moz-opacity: 1;
  opacity: 1;
}

.cont_1_3_box_child{
 margin:2vw;
 position:absolute;
 top:0;
 left:0;
 width:calc( (80vw / 3) - 4vw);
 height:calc( (80vw / 3) - 4vw);
 overflow:hidden; 
}
.cont_1_3_box_child a{
 width:calc( (80vw / 3) - 40px);
 height:calc( (80vw / 3) - 40px);
 display:block;
}
}
@media screen and (max-width:599px){
.cont_1_3_box_k{
 position:relative;
 width:calc(96vw - 2px );
 padding:20px;
 line-height:1.5em;
 text-align:left;
 border:1px solid #231815;
 overflow:hidden;
 float:left;
 margin-bottom:4vw;
}
.cont_1_3_box{
 position:relative;
 width:calc( (96vw / 2) - 2px );
 height:calc( (96vw / 2) - 2px );
 float:left;
 overflow:hidden;
 background:rgba(0,0,0,0.3);
 border:1px dotted #fff;
}
.cont_1_3_box_child{
 margin:3vw;
 position:absolute;
 top:0;
 left:0;
 width:calc( (96vw / 2) - 6vw);
 height:calc( (96vw / 2) - 6vw);
 overflow:hidden; 
}
.cont_1_3_box_child a{
 width:calc( (96vw / 2) - 6vw);
 height:calc( (96vw / 2) - 6vw);
 display:block;
}
}
.cont_1_3_box_child img{
 position:absolute;
 top:0;
 left:0;
 max-height:100%;
}
.cont_1_3_box:hover .cont_1_3_box_child,
.cont_1_3_box:focus .cont_1_3_box_child {
  transform: scale(1.5);
  transition: all 1.0s;
}

@media screen and (min-width:600px){
.site_name{
 position: absolute;
 top:0;
 left:0;
 width:100%;
 height:4vw;
 line-height:4vw;
 background:rgba(0,0,0,0.7);
 color:#fff;
 z-index:10;
}
.site_count{
 position: absolute;
 bottom:20px;
 right:20px;
 min-width:10vw;
 height:2.5vw;
 line-height:2.5vw; 
 border-radius:1.25vw/1.25vw; 
 background:rgba(0,0,0,0.7);
 color:#fff;
 font-size:80%;
}
}
@media screen and (max-width:599px){
.site_name{
 position: absolute;
 top:0;
 left:0;
 width:100%;
 line-height:1.2em;
 padding:6px;
 overflow:hidden;
 font-size:80%;
 background:rgba(0,0,0,0.7);
 color:#fff;
 z-index:10;
}
.site_count{
 position: absolute;
 bottom:2vw;
 right:2vw;
 min-width:30vw;
 height:6vw;
 line-height:6vw; 
 border-radius:3vw/3vw; 
 background:rgba(0,0,0,0.7);
 color:#fff;
 font-size:80%;
}
}

@media screen and (min-width:600px){
.copy_cap{
 position: absolute;
 bottom:0;
 left:0;
 width:100%;
 line-height:1.2em;
 padding:10px;
 overflow:hidden;
 background:rgba(0,0,0,0.7);
 color:#fff;
 z-index:10;
 text-align:left;
 font-size:80%;
}
}
@media screen and (max-width:599px){
.copy_cap{
 position: absolute;
 bottom:0;
 left:0;
 width:100%;
 line-height:1.2em;
 padding:10px;
 overflow:hidden;
 background:rgba(0,0,0,0.7);
 color:#fff;
 z-index:10;
 text-align:left;
 font-size:60%;
}
}


/*------------------------>ページャー*/
#pager_guid{
 width:100%;
 overflow:hidden;
}
@media screen and (min-width:600px){
.peg_com_1{
 width:40px;
 height:40px;
 border:1px solid #b5b5b6;
 float:left;
 margin-right:6px;
 text-align:center;
 line-height:40px;
}
.peg_com_1 a{
 color:#fff;
 background-color:#599d7e;
 border:1px solod #599d7e;
 display:block;
 text-decoration:none;
}
.peg_com_1 a:hover{
 color:#fff;
 background-color:#f39800;
 border:1px solod #f39800; 
}
}
@media screen and (max-width:599px){
.peg_com_1{
 width:40px;
 height:40px;
 border:1px solid #b5b5b6;
 float:left;
 margin-right:6px;
 text-align:center;
 line-height:40px;
 border-radius:20px/20px;
}
.peg_com_1 a{
 color:#fff;
 background-color:#599d7e;
 border:1px solod #599d7e;
 display:block;
 text-decoration:none;
 border-radius:20px/20px;
}
.peg_com_1 a:active{
 color:#fff;
 background-color:#f39800;
 border:1px solod #f39800;
 border-radius:20px/20px; 
}
}
/*----------------------->フォント<--------------------*/
.fon_160_b{font-size:160%;font-weight:bold;}
.fon_160{font-size:160%;}
.fon_140{font-size:120%;}
.fon_120_b{font-size:120%;font-weight:bold;}
.fon_b{font-weight:bold;}
.fon_90{font-size:90%;line-height:1.2em;}
.fon_90_bol{font-size:90%;line-height:1.2em;font-weight:bold;}
.fon_80{font-size:80%;line-height:1.2em;}
.fon_80_bol{font-size:80%;font-weight:bold;line-height:1.2em;}
.fon_70{font-size:70%;line-height:1.2em;}
.fon_70_bol{font-size:70%;font-weight:bold;line-height:1.2em;}
.wf-mplus1p { font-family: "M PLUS 1p"; }


h1 {
 line-height:1.2em;
 margin:0px;
 font-size:180%;
 font-weight:400;
 color:#00a0e9;
}
@media screen and (min-width:600px){
h2 {
 line-height:1.2em;
 margin:0vw 0vw 1vw 0vw;
 font-size:2vw;
 }
}
@media screen and (max-width:599px){
h2 {
 line-height:1.2em;
 margin:0vw 0vw 4vw 0vw;
 font-size:5vw;
 }
}
h3 {
 line-height:1.2em;
 margin:0px;
 font-size:120%;
 }
 
/*----------------->ページの骨格<------------------*/
@media screen and (min-width:600px){ 
#yerrow_band{
 position:relative;
 top:0px;
 width:100%;
 height:8vw;
 background:rgba(255,255,0,0.2);
 margin-bottom:2vw;
}
}
@media screen and (max-width:599px){
#yerrow_band{
 position:relative;
 top:0px;
 width:100%;
 height:22vw;
 background:rgba(255,255,0,0.2);
 margin-bottom:5vw;
}
}

@media screen and (min-width:600px){ 
header{
 position: absolute;
 top:16px;
 left:10vw;
 background-image:url(../images/hed_bak_10.png);
 width:80vw;
 height:8vw;
 background-repeat:no-repeat;
 background-size:100%;
}
#s_logo{
 width:13.8vw;
 float:right;
}
#hed_btn{
 position: absolute;
 top:0px;
 left:0px;
 width:40vw;
 height:6vw;
}
}
@media screen and (max-width:599px){ 
header{
 position: absolute;
 top:6px;
 left:2vw;
 background-image:url(../images/hed_bak_10.png);
 width:96vw;
 height:22vw;
 background-repeat:no-repeat;
 background-size:100%;
 overflow:hidden;
 display:block;
}
#s_logo{
 position:absolute;
 bottom:2vw;
 left:0vw;
 width:60vw;
 float:left;
}
#hed_btn{
 position: absolute;
 top:0px;
 left:0px;
 width:70vw;
 height:18vw;
}
}

@media screen and (min-width:600px){
#menu{
 position:fixed;
 top:8vw;
 right:0vw;
 width:20vw;
 overflow:hidden;
 background:#231815;
 z-index:20;
 text-align:left;
 display:none;
}
#menu li a{
 padding:16px 0px 16px 30px;
 color:#fff;
 text-decoration:none;
 display:block;
 border-bottom:1px dotted #bfbfbf;
}
}
@media screen and (max-width:599px){
#menu{
 position:fixed;
 top:18vw;
 right:0vw;
 width:100%;
 overflow:hidden;
 background:rgba(0,0,0,0.6);
 z-index:20;
 text-align:center;
 display:none;
}
#menu li a{
 padding:16px 0px 16px 0px;
 margin:10px 0px;
 color:#fff;
 background:rgba(0,0,0,1);
 text-decoration:none;
 display:block;
}
}

@media screen and (min-width:600px){
#menu_open{
 position:fixed;
 top:calc(8vw - 3.5vw);
 right:0vw; 
 width:3.5vw;
 z-index:20;
 cursor:pointer;
}
#menu_close{
 position:fixed;
 top:calc(8vw - 3.5vw);
 right:0vw; 
 width:3.5vw;
 z-index:20;
 display:none;
 cursor:pointer;
}
}
@media screen and (max-width:599px){
#menu_open{
 position:fixed;
 top:6vw;
 right:2vw; 
 width:12vw;
 z-index:20;
 cursor:pointer;
}
#menu_close{
 position:fixed;
 top:6vw;
 right:2vw; 
 width:12vw;
 z-index:20;
 display:none;
 cursor:pointer;
}
}

@media screen and (min-width:600px){ 
#container{
 position:relative;
 width:80vw;
 margin-left:10vw;
 margin-bottom:4vw;
 overflow:hidden;
}
}
@media screen and (max-width:599px){ 
#container{
 width:96vw;
 margin-left:2vw;
}
}

#footer{
 position:relative;
 width:100%;
 padding:10px;
 word-wrap: break-word;
 border-top:3px solid #bfbfbf;
 background:#2f2725;
 line-height:1.2em;
 color:#fff;
 overflow:hidden;
 display:block;
}
@media screen and (min-width:600px){ 
#footer{
 text-align:center;
 font-size:70%;
}
}
@media screen and (max-width:599px){ 
#footer{
 text-align:left;
 font-size:60%;
 margin-right:2vw;
}
}
#footer a{
 text-decoration:none;
 color:#fff;
}
#log_form{
 display:none;
}

/*------------------>編集ページ<------------------*/
#ED_container{
 position:relative;
 width:1024px;
 margin:20px auto;
 overflow:hidden;
 background:#fff;
}
#ED_right_box{
 width:720px;
 float:right;
 line-height:1.4em;
 text-align:left;
}
#ED_left_box{
 width:300px;
 float:left;
 font-size:80%;
 line-height:1.4em;
}

/*------------------>定常指定部分<------------------*/
@media screen and (min-width:600px){
.pc{display:block;}
.s{display:none;}
}
@media screen and (max-width:599px){
.s{display:block;}
.pc{display:none;}
}

/* ------------------------->クリア*/
.cr{clear:both;}

div{box-sizing:border-box;}

ul{
 margin:0;
 padding:0;
 }
li{
 list-style:none;
}

p{
 margin:0px;
 padding:0px;
}

 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;
}

body { 
 margin:0 auto;
 text-align:center;
 color:#595757;
 font-family:"メイリオ","Meiryo","ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro","ＭＳ Ｐゴシック","MS P Gothic",sans-serif;
 line-height:1em;
 overflow-x:hidden;
 background-repeat:no-repeat;
 background-size:100%;
}
@media screen and (min-width:600px){
body{
 background-image:url(../images/pge_bak_02.jpg);
background-attachment:fixed;
 top:0;
 left:0;
 font-size:1.1vw;
}
}
@media screen and (max-width:599px){
body{
 background-image:url(../images/pge_bak_01.jpg);
background-attachment:fixed;
 font-size:4.5vw;
}
}