@charset "utf-8";
@media (max-width: 768px){
	
	 body {
    margin: 0;
    padding: 0;
  }

  h1 {
    margin: 0;
    padding: 20px;
  }
  h1 img{
    width:40%;
    height:40%;
  }








#drawer_header {
    font-size: 20px;
    padding: 15px 25px;
    color: #fff;
    font-weight: bolder;
  }

  #drawer_menu {
    position: fixed;
    left: 0;
    display: none;
    width: 250px;
    height: 100%;
    background: #000;
    overflow: auto;
    z-index:2;
  }

  #drawer_menu ul li a{
    text-decoration: none;
    color: #fff;
  }

  #drawer_menu ul{
    width: 250px;
    padding-left: 0;
    list-style-type: none;
  }

  #drawer_menu ul li{
    padding: 15px 15px;
  }




  #drawer_btn{
    position: fixed;
    top: 15px;
    right: 10px;
    transition: 0.3s;
    width: 50px;
    height: 50px;
    z-index:2;
  }





  #drawer_btn span {
    position: absolute;
    right: 5px;
    width: 80%;
    height: 6px;
    border-radius: 3px;
    background-color: #fff;
  }

  #drawer_btn span:nth-of-type(1) {top: 5px;}
  #drawer_btn span:nth-of-type(2) {top: 20px;}
  #drawer_btn span:nth-of-type(3) {top: 35px;}


/*----------- color change  -------*/
#drawer_menu ul .gnav06 :nth-child(n+10) a{
margin-left:1.0rem;

/*--color:#C1CFE3;--*/

}
/*----------- end of color -------*/


#classic #drawer_menu .gnav02 a{
	color:#a4a9cf;
}

#col_sino #drawer_menu .gnav03 .g03_sino a,
#col_sino2 #drawer_menu .gnav03 .g03_sino a,
#col_sino3 #drawer_menu .gnav03 .g03_sino a,
#col_sino4 #drawer_menu .gnav03 .g03_sino a{
	color:#a4a9cf;
}
#col_karatu #drawer_menu .gnav03 .g03_karatu a,
#col_karatu2 #drawer_menu .gnav03 .g03_karatu a,
#col_karatu3 #drawer_menu .gnav03 .g03_karatu a{
	color:#a4a9cf;
}
#col_setoguro #drawer_menu .gnav03 .g03_setoguro a,
#col_setoguro2 #drawer_menu .gnav03 .g03_setoguro a{
	color:#a4a9cf;
}
#col_kiseto #drawer_menu .gnav03 .g03_kiseto a{
	color:#a4a9cf;
}
#col_hanaire #drawer_menu .gnav03 .g03_hanaire a,
#col_hanaire2 #drawer_menu .gnav03 .g03_hanaire a,
#col_hanaire3 #drawer_menu .gnav03 .g03_hanaire a{
	color:#a4a9cf;
}

#kodawari #drawer_menu .gnav04 .g04_tuti a,
#kodawari2 #drawer_menu .gnav04 .g04_yuu a,
#kodawari3 #drawer_menu .gnav04 .g04_kama a,
#kodawari4 #drawer_menu .gnav04 .g04_kou a{
	color:#a4a9cf;
}

#blog #drawer_menu .gnav07 a{
	color:#a4a9cf;
}


#contact #drawer_menu .gnav05 a{
	color:#a4a9cf;
}

/*----------- Toggle taiou ---------*/
#drawer_menu ul li dt{
color:#fff;
}

#drawer_menu ul li dd{
padding-top:10px;
color:#fff;
}
#drawer_menu ul li dd a{
	color: #aaa;
}
/*----------- End of Toggle --------*/


#header div .hero_img {
	width: 100%;
	height: auto;
}


#header div .hero_img {
	position:relative;
	  }
	  
h1{
	font-weight: bold;
	line-height:1.2rem;
	color: #fafafa;
	padding-top: 10px;
	padding-bottom: 10px;
	position:absolute;
	top:10px;
	
}
#header .info{
margin-left:10px;
margin-bottom:10px;
}


#header .info2 h3 a{
margin-left:5px;
font-weight: bold;
color:#6D8CDB;
text-decoration: none;
}
#header .info3 h3 a{
margin-left:5px;
font-weight: bold;
color:#6D8CDB;
text-decoration: none;
}
#header .info3 span{
color:#E64C7E;
}
#header .info2 span{
color:#E64C7E;
}

#home #wrap{
position:relative;
}


#header h2{
margin-top:5px;
margin-left:10px;
margin-bottom:5px;
font-weight:bold;
font-size:1.5rem;
}
#home #header h2{

font-weight:bold;
font-size:1.0rem;
line-height:1.2rem;
color: #515555;
}


#home #header .scroll2 {
  overflow   : hidden;
  text-align:left;
}
#home #header .scroll2 span{

  color      : #515555;
  font-weight:bold;
  display     : inline-block;
  padding-left:0px;
  white-space : nowrap;
  line-height : 1em;
  animation   : scrollAnime 15s ease-out 0s infinite forwards;
}
@keyframes scrollAnime{
 0% { transform: translateX(100%)}
  100% { transform: translateX(-100%)}
}

#col_sino #header h2{
color:#FF9529;
}
#col_karatu #header h2{
color:#706960;
}
#col_setoguro #header h2{
color:#112631;
}
#col_setoguro2 #header h2{
color:#BF1E56;
}

#col_kiseto #header h2{
color:#FF9529;
}
#col_hanaire #header h2{
color:#835CB5;
}
#monyo #header h2{
color:#3180FF;
}


#header h3{
width:94%;
margin-left:10px;
margin-bottom:5px;
line-height:1.25rem;
padding:5px 0;
border-radius:3px;
box-shadow:0 0 0 1px #fff inset;
background-color: rgba(255, 255, 255, 0.65);
}



#home #header h3{
border-radius:0px;
box-shadow:0 0 0 0 #fff inset;
background-color: rgba(255, 255, 255, 0);
margin:0;
padding:0 0 3px 0;
}


#home .info{
width:94%;
line-height:1.25rem;
padding:5px 0;
border-radius:3px;
box-shadow:0 0 0 1px #fff inset;
background-color: rgba(255, 255, 255,0.55);
}


#home #header h3{
line-height:1.0rem;

}
#header h3 span{
font-weight:bold;
}






#classic header section{
line-height:1.2rem;
width:94%;
margin-left:10px;
margin-bottom:10px;
padding:5px 0;
border-radius:3px;
box-shadow:0 0 0 1px #fff inset;
background-color: rgba(255, 255, 255,0.75);
}

#kodawari header h3{
width:94%;
border-radius:3px;
box-shadow:0 0 0 1px #fff inset;
background-color: rgba(255, 255, 255,0.75);
padding:5px 0;
}
#kodawari main h2,
#kodawari2 main h2,
#kodawari3 main h2{
font-weight:bold;
color:#000;
font-size:1.2rem;
}
#kodawari3 main h2 span{
font-weight:normal;
font-size:1.0rem;
}

#classic header h4{
font-weight:bold;
}


#kodawari2 .second{
margin-top:50px;
}


#kodawari2 .second h3,
#kodawari4 .second h3{
width:94%;
font-weight:normal;
margin-bottom:5px;
line-height:1.25rem;
padding:5px 0;
border-radius:3px;
box-shadow:0 0 0 1px #fff inset;
background-color:#8FD0CB
}

#kodawari2 .second_p h4{
width:94%;
margin-bottom:10px;
padding:5px 0;
background-color: rgba(247,248,248,0.75);
}






#pankuzu{
display:none;
}



#blog #header{
margin-bottom:10px;
}

#blog #header #scroll2 img{
width:100%;
}

#blog #header #scroll2{

  max-height: 380px;
  display     : inline-block;
  white-space : nowrap;
  animation   : scrollAnime1 7s ease-in-out 0.2s infinite alternate;
}
@keyframes scrollAnime1{
    0% { transform: translateY(0%)}
  100% { transform: translateY(-100%)}
}







#blog #pankuzu{
display:inline;
color:#666666;
font-size: 1rem;
}


#blog #pankuzu li{
    margin-left:10px;
	padding-right: 15px;
	background: url(../images/ico_arw01.png) right center no-repeat;
	display: inline;
}


#blog #pankuzu a{
	color:#666666;
	text-decoration: none;
}



#main-contents{
width:95%;
margin-left:10px;
}
#blog #main-contents{
width:97%;
margin-left:10px;
}


#main-contents h2 {
	width:350px;
	padding-top:5px;
	padding-bottom: 5px;
	color: #515555;
	
	font-weight:bold;
}

#main-contents h3{
font-weight:bold;
margin:5px 0 8px 0;
}




main #sino .isino,
main #karatu .ikaratu,
main #setoguro .isetoguro,
main #kiseto .ikiseto,
main #cole .icole,
main #blog_e .iblog_e{
width:100%;
height:auto;
}













main #inner3 img,
main #inner4 img,
main #inner4a img,
main #inner5 img{
width:100%;
height:100%
}
main #inner4 .waraji{
width:50px;
height:50px;
vertical-align:top;
}



main #inner6,
main #inner7{
margin-top:30px;
margin-bottom:20px;
}
main #inner6 video,
main #inner7 video{
width:100%;
height:100%
}
main #inner6 .anime,
main #inner7 .anime{
width:100%;
height:100%
}

main #inner7 h3 a{
text-decoration:none;
}


#kodawari3 main #oogama .kama_con{
width:100%;
height:100%
}





#inner01 .sino01,
#inner02 .sino02,
#inner03 .sino03,
#inner04 .sino04,
#inner05 .sino05,
#inner06 .sino06,
#inner07 .sino07,
#inner08 .sino08,
#inner09 .sino09,
#inner10 .sino10,
#inner11 .sino11,
#inner12 .sino12,
#inner13 .sino13,
#inner14 .sino14,
#inner15 .sino15,
#inner16 .sino16,
#inner17 .sino17,
#inner18 .sino18{
padding:5px 0;
width:330px;
	background-color: rgba(247,248,248,0.6);
	margin-bottom:20px;
}

#blog #inner01 .sino01{
padding:5px 0;
width:97%;
	background-color: rgba(247,248,248,0.6);
	margin-bottom:20px;
}
#blog #inner01 .sino01 p img{
   width:30%;
    height:30%;
    }

#inner01 .sino01 h3,
#inner02 .sino02 h3,
#inner03 .sino03 h3,
#inner04 .sino04 h3,
#inner05 .sino05 h3,
#inner06 .sino06 h3,
#inner07 .sino07 h3,
#inner08 .sino08 h3,
#inner09 .sino09 h3,
#inner10 .sino10 h3,
#inner11 .sino11 h3,
#inner12 .sino12 h3,
#inner13 .sino13 h3,
#inner14 .sino14 h3,
#inner15 .sino15 h3,
#inner16 .sino16 h3,
#inner17 .sino17 h3,
#inner18 .sino18 h3{
font-size:1.0rem;
font-weight:bold;
display:block;
padding-left:5px;
border-left:#00c4ab 8px solid;
}











main #inner3 .ilink,
main #inner4 .ilink,
main #inner4a .ilink{
display:none;
}

main #inner3{
margin-bottom:15px;
}





main #inner01 p,
main #inner02 p,
main #inner03 p{
	line-height:1.2em;
		
}

#access main #inner01 .p1,
#guide main #inner01 .p1{
	margin-bottom:15px;
}
#access main #inner01 p span,
#guide main #inner01 p span,
#seeing main #inner01 p span,
#seeing main #inner02 p span,
#seeing main #inner03 p span{
	font-weight:bold;
}




#home #inner1 #sino p a{
color:#d00;
font-weight:bold;
text-decoration:none;
}

#home .blinking{
color:#FA60A4;
font-weight:bold;
}
#home #karatu a{
text-decoration:none;
}


#home #inner1 #sino p span{
color:#E85484;
font-weight:bold;
}



#home main #inner2 p span{
font-weight:bold;
color:#CC4A48;
}
#home main #inner2 p a{
text-decoration:none;
}
#home main #inner2 #kiseto a{
text-decoration:none;
color:#000;
}
#home main #inner2 #blog_e a{
text-decoration:none;
color:#000;
}


#home #inner3 .kaisetu{
margin-bottom:20px;
}


#home #inner3 h3 a,
#home #inner4 h3 a,
#home #inner4a h3 a{
line-height:30px;
color:#555;

}
#home #inner3 h3 span{
color:#d00;
}

#home #inner4 h3 span{
color:#FA60A4;
}

    
    
#home #inner5 h3 a{
color:#E85585;
text-decoration:none;
}



/*------------ blog latest ---------*/
#inner5 .blog_s h4{
	margin-top:20px;
}
#inner5 .blog_s li{
	color: #565656;
	font-size: 1.0rem;
	line-height:30px;
	padding-left: 15px;
	background:url(../images/ico_arw01.png) left center no-repeat;
}








/*---------------------------------------------*/
main p{
	
        margin-bottom:10px;
}
	

#kodawari3 main #oogama{
width:95%;
	margin-left:2.5%;
	margin-bottom:5px;
	position:relative;
}

#kodawari3 main #oogama img{
width:100%;
height:auto;
}

#kodawari3 main #oogama .kama_in1 img{
position:absolute;
top:11.5%;
left:1%;
width:6.3%;
height:auto;
}

#kodawari3 main #oogama .kama_in3 img{
position:absolute;
top:38%;
left:3%;
width:10.5%;
height:auto;
}
#kodawari3 main #oogama .kama_in4 img{
position:absolute;
top:44%;
left:27%;
width:12.5%;
height:auto;
}
#kodawari3 main #oogama .kama_in6 img{
position:absolute;
top:1%;
left:26%;
width:10.0%;
height:auto;
}
#kodawari3 main #oogama .kama_in7 img{
position:absolute;
top:1%;
left:62%;
width:9.8%;
height:auto;
}
#kodawari3 main #oogama .kama_in8 img{
position:absolute;
top:23%;
left:77%;
width:10.5%;
height:auto;
}

#kodawari3 main .oo_exp h3{
width:94%;
margin-left:10px;
margin-bottom:5px;
font-weight:normal;
line-height:1.25rem;
padding:5px 0;
border-radius:3px;
box-shadow:0 0 0 1px #fff inset;
background-color: rgba(255, 255, 255, 0.65);
}

#kodawari3 main .fire_1{
position:absolute;
top:69%;
left:8.0%;
width:17%;
height:auto;
display:none;
}
#kodawari3 main .fire_2{
position:absolute;
top:78%;
left:25%;
width:5.0%;
height:auto;
display:none;
}
#kodawari3 main .fire_3{
position:absolute;
top:55%;
left:28.8%;
width:16.0%;
height:auto;
display:none;
}
#kodawari3 main .fire_4{
position:absolute;
top:71.0%;
left:43%;
width:4.0%;
height:auto;
display:none;
}
#kodawari3 main .fire_5{
position:absolute;
top:33.0%;
left:85.5%;
width:4.5%;
height:auto;
display:none;
}
#kodawari3 main .fire{
color:#dd0000;
}





main #scrollTop a{
display:none;
}

#top_ico{
margin-left:38%;
margin-bottom:15px;
}

#local_nav p{
margin-left:38%;
}

#kodawari #local_nav p,
#kodawari2 #local_nav p,
#kodawari3 #local_nav p,
#kodawari4 #local_nav p{
margin-left:10px;
}




#local_nav img{
width:17%;
height:auto;
}

#local_nav li{
display:inline;
}


#counter{
margin-bottom:10px;
margin-left:35%;
}

#blog #inner01 .sino01 img{
width:100%;
height:auto;
margin-bottom:5px;
}

#blog #inner01 .sino01 video{
	width:100%;
	height:auto;
	margin-bottom:5px;
}




#blog #inner01 #side_menu{
margin-bottom:10px;
}
#blog #inner01 #side_menu li{
	margin-bottom:5px;
	color: #565656;
	font-size: 1.0rem;
	padding-left: 15px;
	background: url(../images/ico_arw01.png) left center no-repeat;
}
#blog #inner01 #side_menu a{
text-decoration:none;
color:#565656;
line-height:30px;
}

#blog #inner01 figure{
margin-bottom:5px;
}
#blog #inner01 #side_menu h3 span{
color:#DD5145;
}


    #karatu #scrollTop{
        display:none;
    }

    
#col_setoguro2 section h3 span{
color:#BF1E56;
}


#blog #main-contents #inner01 .sino01 .waraji{
width:50px;
height:50px;
vertical-align:top;
}






footer{
	width:100%;
	background-color:#a4a9cf;
}
footer .sino01 figure .ffig{
margin-bottom:5px;
}
footer a{
margin-left:30%;
}


footer p{
	text-align:center;
	color:#fff;
	padding-bottom:5px;
	font-size:12px;
}


/*-----------------contact CSS------------------------*/
#contact #header h2{
color:#112631;
margin-bottom:5px;
}


#contact #main-contents{
margin-left:10px;
}

#contact #main-contents ol{
font-size:1.0rem;
line-height:1.2rem;
margin-bottom:10px;
}

#contact table{
/*border:#f6bb9e 2px solid;
border-collapse:collapse;*/
margin-bottom:10px;
}



#contact table th{
font-weight:bold;
vertical-align:top;
font-size:0.8rem;
}



#contact table th,
#contact table td{
/*border:#f6bb9e 2px solid;*/
padding-bottom:10px;

}

#contact label,
input,textarea{
	cursor: pointer;
}





#contact .btn{
margin-left:10px;;
margin-right:50px;
margin-bottom:10px;
}

#contact .btn .btn-sub,
#contact .btn .btn-clr{
border-radius:5px;
margin-right:20px;
}

#contact .btn-sub:hover{
background-color:#2d5694;
color:#f7f8f8;
}
#contact .btn:active{
	color: #fff;
}

#contact .btn-clr:hover{
opacity:0.5;
}




#home .blinking{
color:#d00;
font-weight:bold;
	-webkit-animation:blink 1.0s ease-in-out infinite alternate;
    -moz-animation:blink 1.0s ease-in-out infinite alternate;
    animation:blink 1.0s ease-in-out infinite alternate;
}

@keyframes blink{
    0% {opacity:0;}
    100% {opacity:1;}
}




/*-------------------- kojin ---------------------*/
#contact #kojin h3{
font-size:1.0rem;
margin-bottom:5px;
}
#contact #kojin ol{
font-size:1.0rem;
line-height:1.2rem;
margin-bottom:5px;
}


}