/* for TAB and PC */
@media all and (min-width: 768px){
	#navi {
		display: block !important;
	}
}


/* for TAB */
@media all and (min-width: 768px) and (max-width: 1024px){
	body {
		-webkit-text-size-adjust: 100%;
	}

	#wrapper {
		width: 768px;
	}
	#page_body, #page_bottom {
		width: 696px;
		margin-left: 36px;
	}
	#contents {
		width: 529px;
		padding: 0;
		margin: 0;
	}

	/* header */

	#header_2 {
		background-size: 742px;
		height: 151px;
		width: auto;
	}
	#root_list {
		left: 57px;
		top: 8px;
	}
	#logo a {
		left: 65px;
		top: 40px;
		background-size: 345px;
		width: 345px;
		height: 52px;
	}
	#search {
		width: 118px;
		left: 84px;
		top: 105px;
	}
	#search_bn {
		left: 207px;
		top: 103px;
		width: 65px;
		height: 21px;
	}

	/* footer */

	#footer {
		padding: 30px 40px 17px 45px;
		height: auto;
		margin-left: 36px;
		width: 611px;
		background-size: 696px;
	}
	#footer ul {
		padding: 3px 20px 17px 20px;
		text-align: center;
	}
	#footer li {
		display: none;
		float: none;
	}
	#footer li a {
		height: 30px;
		width: auto;
	}
	#footer li#webjapan {
		display: inline-block;
		width: auto;
	}

	/* navi */

	#gnaviPlay {
		margin: 13px 0 0 0;
	}

	/* cotents */

	#pagetitle {
		background-position: -10px 0;
		background-size: 545px;
		width: 520px;
	}
	#title_txt2 {
		left: 20px;
		top: 22px;
	}
	#title_txt2_2 {
		left: 20px;
		top: 22px;
	}
	#title_txt3 {
		left: 23px;
		top: 46px;
	}
	#title_txt3_2 {
		left: 23px;
	}
	#gotojp {
		margin: 70px 15px 0 0;
	}

	.box_01 {
		padding: 0 0 10px 13px;
	}
	.box_02 {
		padding: 0 0 10px 13px;
	}

	#guide {
		width: 529px;
	}
	#guide_index a {
		left: 205px;
	}
	
	/* for calendar page */
	
	.box_line1_green {
		padding: 0 0 10px 13px;
		max-width: 508px;
	}
	
	#line1_green {
 		width: 100%;
 		margin-right: 0px;
 		margin-left: 0px;
 		padding-left: 0px;
 		padding-right: 0px;
	}
}


/* for SP */
#sp_menu_bt {
	display: none;
	position: absolute;
	left: 0;
	top: 55px;
	width: 95px;
	height: 22px;
	text-indent: -9999px;
}
#sp_menu_bt.open {
	background: url(../images/kids_menu_open.gif) no-repeat;
}
#sp_menu_bt.close {
	background: url(../images/kids_menu_close.gif) no-repeat;
}

@media all and (max-width: 767px){
	.is_pctab {
		display: none;
	}

	* {
		box-sizing: border-box;
	}
	html {
		background: none;
		min-width: 320px;
	}
	body {
		width: 100%;
		-webkit-text-size-adjust: 100%;
	}
	#wrapper, #wrapper2, #page_body, #contents, #guide {
		min-width: 100%;
		width: 100%;
		margin: 5px 0 0 0;
		padding: 0;
	}
	#wrapper_menu {
		width: 100%;
	}

	/* header */

	#header_2 {
		width: 100%;
		height: auto;
		position: static;
		background: url(../images/header_02_sp.jpg) top right no-repeat;
		background-size: auto 75px;
	}
	#header_2 > #logo {
		display: block;
		height: 45px;
	}
	#header_2 > #logo a{
		position: static;
		display: block;
		width: 250px;
		height: 50px;
		background: url(../images/logo_sp.png) no-repeat;
		background-size: 230px;
		background-position: 8px 8px;
	}
	#header_2 > form {
		position: relative;
		height: 30px;
	}
	#header_2 > form > #search {
		left: auto;
		right: 75px;
		top: 10px;
		z-index: 999;
	}
	#header_2 > form > #search_bn {
		left: auto;
		right: 0;
		top: 6px;
	}
	#header_2 > form:after {
		content: "";
		position: absolute;
		height: 20px;
		display: block;
		background: #FFF;
		right: 71px;
		top: 6px;
		width: 131px;
		z-index: 998;
		border: 1px solid #CCC;
		border-radius: 5px;
	}
	#root_list {
		display: none;
	}

	/* footer */

	#page_bottom {
		min-width: 100%;
		width: 100%;
		margin: 0;
		padding-top: 5px;
	}

	#footer {
		width: 100%;
		margin: 0;
		padding: 0;
		height: 35px;
		background-position: top center;
	}
	#footer ul {
		padding: 35px 20px 20px 20px;
		text-align: center;
	}
	#footer li {
		display: none;
		float: none;
	}
	#footer li a {
		height: 30px;
		width: auto;
	}
	#footer #webjapan {
		display: inline-block;
		width: auto;
	}

	/* navi */

	#sp_menu_bt {
		display: block;
	}

	#navi {
		background-color: #FFF;
		position: absolute;
		display: none;
		width: 172px;
		box-shadow: 2px 2px 1px 1px rgba(0,0,0,0.2);
		position: absolute;
		left: 0;
		top: 77px;
	}

	/* cotents */

	#pagetitle {
		height: auto;
		margin: auto;
		padding: 10px;
		border-radius: 10px;
		border: 1px solid #BBB;
		box-shadow:0px 0px 5px 2px #BBB inset;
		background: none;
		background-color: #F7F7F7;
		width: 520px;
		max-width: 97%;
	}
	#pagetitle.title_yellow {
		border: 1px solid #FC9709;
		box-shadow:0px 0px 5px 2px #FC9709 inset;
		background-image: -moz-linear-gradient(top, #FEDD76, #FFEEA6);
		background-image: -ms-linear-gradient(top, #FEDD76, #FFEEA6);
		background-image: -o-linear-gradient(top, #FEDD76, #FFEEA6);
		background-image: -webkit-linear-gradient(top, #FEDD76, #FFEEA6);
		background-image: linear-gradient(top, #FEDD76, #FFEEA6);
	}
	#pagetitle.title_green {
		border: 1px solid #5DAF31;
		box-shadow:0px 0px 5px 2px #5DAF31 inset;
		background-image: -moz-linear-gradient(top, #92DC73, #D6F3BB);
		background-image: -ms-linear-gradient(top, #92DC73, #D6F3BB);
		background-image: -o-linear-gradient(top, #92DC73, #D6F3BB);
		background-image: -webkit-linear-gradient(top, #92DC73, #D6F3BB);
		background-image: linear-gradient(top, #92DC73, #D6F3BB);
	}

	.title_img_green_02 {
		display: none;
	}
	#title_txt1 {
		position: static;
		margin: 10px;
	}
	#title_txt2, #title_txt2_2 {
		position: static;
		margin: 0;
	}
	#title_txt3, #title_txt3_2 {
		position: static;
		padding: 5px 15px 15px 15px;
		font-size: 20px;
	}

	#gotojp {
		position: absolute;
		margin: 0;
		right: 20px;
		bottom: 10px;
	}

	.box_01, .box_02 {
		width: 100%;
		max-width: 508px;
		padding: 10px;
		box-sizing: border-box;
		margin: auto;
	}
	.main_content, #learn .main_content {
		box-sizing: content-box;
		width: auto;
		margin: auto;
		max-width: 470px;
	}

	#guide {
		margin: 0;
	}
	#guide ul {
		position: static;
	}
	#guide li {
		text-align: center;
		position: static;
	}
	#guide li a {
		left: auto;
		position: static;
		display: inline-block;
	}


	/* base image size */
	.img_left {
		width: 45%;
		max-width: 250px;
	}
	.img_left img{
		max-width: 100%;
		height: auto;
	}
	.img_right {
		width: 45%;
		max-width: 250px;
	}
	.img_right img{
		max-width: 100%;
		height: auto;
	}

	/* for nature page */

	.img_right200 {
		width: 45%;
		max-width: 200px;
	}
	.img_right200 img{
		max-width: 100%;
		height: auto;
	}
	
	/* for culture page */
	
	.img_left200 {
		width: 45%;
		max-width: 200px;
	}
	.img_left200 img{
		max-width: 100%;
		height: auto;
	}
	
	.img_right201 {
		width: 45%!important;
		max-width: 201px;
	}
	.img_right201 img{
		max-width: 100%;
		height: auto;
	}
	/* for calendar page */
	
	.box_line1_green {
		max-width: 508px;
		padding: 10px;
		box-sizing: border-box;
		margin: auto;
	}
	#line1_green {
 		width: 100%;
 		margin-right: 0px;
 		margin-left: 0px;
 		padding-left: 0px;
 		padding-right: 0px;
	}
	
	.img_left160 {
		width: 45%;
		max-width: 160px;
	}
	.img_left160 img{
		max-width: 100%;
		height: auto;
	}
	
	.img_left213 {
		width: 45% !important;
		max-width: 213px;
	}
	.img_left213 img{
		max-width: 100%;
		height: auto;
	}
	
	.img_left220 {
		width: 45%;
		max-width: 220px;
	}
	.img_left220 img{
		max-width: 100%;
		height: auto;
	}
	
	.img_left300 {
		width: 45%;
		max-width: 300px;
	}
	.img_left300 img{
		max-width: 100%;
		height: auto;
	}
	
	.img_right130 {
		width: 45%;
		max-width: 130px;
	}
	.img_right130 img{
		max-width: 100%;
		height: auto;
	}
	
	.img_right180 {
		width: 45%;
		max-width: 180px;
	}
	.img_right180 img{
		max-width: 100%;
		height: auto;
	}
	
	.img_right220 {
		width: 45%;
		max-width: 220px;
	}
	.img_right220 img{
		max-width: 100%;
		height: auto;
	}
	
	.img_right300 {
		width: 45%;
		max-width: 300px;
	}
	.img_right300 img{
		max-width: 100%;
		height: auto;
	}

	/* for history page */
	
	.img_right208 {
		width: 45%!important;
		max-width: 208px;
	}
	.img_right208 img{
		max-width: 100%;
		height: auto;
	}
	
	.block_03 td {
		padding: 3px;
	}	
	.line_right {
		white-space: normal;
	}
	
	/* for schools page */
	
	.img_left180 {
		width: 45%;
		max-width: 180px;
	}
	.img_left180 img{
		max-width: 100%;
		height: auto;
	}
	
	/* for sport */
	
	.img_right204 {
		width: 45% !important;
		max-width: 204px;
	}
	.img_right204 img{
		max-width: 100%;
		height: auto;
	}
	
	.img_right214 {
		width: 45% !important;
		max-width: 214px;
	}
	.img_right214 img{
		max-width: 100%;
		height: auto;
	}
	
	.img_right215 {
		width: 45% !important;
		max-width: 215px;
	}
	.img_right215 img{
		max-width: 100%;
		height: auto;
	}
	
	.img_right216 {
		width: 45% !important;
		max-width: 216px;
	}
	.img_right216 img{
		max-width: 100%;
		height: auto;
	}
	
	.img_right217 {
		width: 45% !important;
		max-width: 217px;
	}
	.img_right217 img{
		max-width: 100%;
		height: auto;
	}
	
	.img_right218, .img_left218 {
		width: 45% !important;
		max-width: 218px;
	}
	.img_right218 img, .img_left218 img {
		max-width: 100%;
		height: auto;
	}
	
	.img_right219 {
		width: 45% !important;
		max-width: 219px;
	}
	.img_right219 img{
		max-width: 100%;
		height: auto;
	}
	
	/* for housing */
	
	.img_right209 {
		width: 45% !important;
		max-width: 209px;
	}
	.img_right209 img{
		max-width: 100%;
		height: auto;
	}
	
	/* for economy page*/
	
	.img_right223 {
		width: 45% !important;
		max-width: 223px;
	}
	.img_right223 img{
		max-width: 100%;
		height: auto;
	}
	
	.img_right228 {
		width: 45% !important;
		max-width: 228px;
	}
	.img_right228 img{
		max-width: 100%;
		height: auto;
	}
	
	/* for basic page */
	
	.img_left130 {
		width: 45%;
		max-width: 130px;
	}
	.img_left130 img{
		max-width: 100%;
		height: auto;
	}	
	.img_right240 {
		width: 45% !important;
		max-width: 240px;
	}
	.img_right240 img{
		max-width: 100%;
		height: auto;
	}

	.to_w80 {
		width: 17%;
		max-width: 80px;
	}
	.to_w159 {
		width: 34%;
		max-width: 159px;
	}
	.to_w180 {
		width: 36%;
		max-width: 180px;
	}
	.to_w225 {
		width: 48%;
		max-width: 225px;
	}
	.to_w260 {
		width: 55%;
		max-width: 260px;
	}
	.to_w280 {
		width: 60%;
		max-width: 280px;
	}
	.to_w300 {
		width: 64%;
		max-width: 300px;
	}
	.to_w320 {
		width: 66%;
		max-width: 320px;
	}
	.to_w370,.to_w380 {
		width: 80%;
	}
	.to_w470 {
		width: 100%;
		max-width: 470px;
	}

	/* for kaiju page */
	.kaiju .img_left300 {
		width: 70%;
		max-width: 100% !important;
	}
	.kaiju .img_left160 {
		width: 48%;
		margin: 0 4% 0 0;
		max-width: 100%;
	}
	.kaiju .cap_txt {
		width: 48%;
		margin-left: 0 !important;
	}
	.kaiju .imgbox  .cap_rt_txt {
		width: 100%;
		float: left;
		margin-left: 0;
	}
	.kaiju .img_half { 
		width: 100% !important;  

	}		
	/* for nawatobi page */
	#nawatobi .to_w420 {
		width: 100%;
	}
	.imgbox iframe {
		width: 100%;
		height: 169px;
	}
	/* for technology page */
	.tech .img_left280 {
		width: 50%;
	}
	.tech .cap_txt {
		width: 45%;
    	margin-left: 5% !important;
	}
	.tech .to_w420 {
		width: 100%;
	}

}