@charset "utf-8";

@media screen and (max-width: 980px) {

	#contents {
		width: 72%;
	}

	#side {
		width: 23%;
	}
}

@media screen and (max-width: 880px) {

	/* header
	================================*/

	/* gnav
	----------------*/

	#gnav li {
		padding: 0 2px;
	}

	#gnav .nav1 { width: 54px; }
	#gnav .nav2 { width: 69px; }
	#gnav .nav3 { width: 69px; }
	#gnav .nav4 { width: 99px; }
	#gnav .nav5 { width: 129px; }
	#gnav .nav6 { width: 69px; }
	#gnav .nav7 { width: 69px; }

	#gnav a {
		font-size: 14px;
	}

	/* gnav2
	----------------*/

	#gnav2_wrap .arrow {
		margin-left: -3px;
	}
}

@media screen and (max-width: 768px) {

	.display_pc {
		display: none;
	}

	.display_tab {
		display: block;
	}

	/* header
	================================*/

	#header_inner_sp {
		margin: 0 auto;
		padding: 30px 18px 27px 18px;
	}

	#header .logo_wrap {
		position: relative;
		height: 54px;
		margin: 0;
		padding: 0 35px 0 0;
	}

	#header .lang {
		display: none;
	}

	#header .menu_btn_sp {
		position: absolute;
		right: 0;
		bottom: 5px;
	}

	#header .menu_btn_sp a {
		display: block;
		padding: 5px;
	}

	#menu_wrap_sp {
		position: absolute;
		right: 0;
		top: 0;
		width: 100%;
		max-width: 380px;
		height: 100%;
	}

	#menu_inner_sp {
		margin: 0 auto;
		padding: 30px 18px 27px 18px;
	}

	#menu_sp {
		line-height: 1.5;
		padding-left: 30px;
	}

	#menu_sp a, #menu_sp ul li {
		color: #929292;
	}

	#menu_sp a:hover {
		text-decoration: none;
	}

	#menu_sp .logo_wrap {
		position: relative;
		height: 54px;
		margin: 0;
		padding: 0 35px 0 0;
	}

	#menu_sp .menu_btn_sp {
		position: absolute;
		right: 0;
		bottom: 5px;
	}

	#menu_sp .menu_btn_sp a {
		display: block;
		padding: 5px;
	}

	#menu_sp .lang {
		margin-bottom: 50px;
	}

	#menu_sp .lang ul {
		padding: 0 25px;
	}

	#menu_sp .lang li:first-child {
		border-top: 1px solid #666;
	}

	#menu_sp .lang li {
		border: 1px solid #666;
		border-top: none;
	}

	#menu_sp .lang a {
		display: block;
		padding: 15px 0 20px 35px;
	}

	#menu_sp .lang .sel a {
		background: url(../images/sp/gnav_arrow1.png) no-repeat right 18px;
	}

	#menu_sp .lang ul,
	#menu_sp .lang li {
		display: none;
	}

	#menu_sp .lang .current,
	#menu_sp .lang .current .sel {
		display: block;
	}

	#menu_sp .search_sp {
		margin: 0 auto;
		padding: 20px 25px;
	}

	#menu_sp .search_sp .text_wrap {
		position: relative;
		padding-right: 56px;
	}

	#menu_sp .search_sp .text {
		display: block;
		float: left;
		margin: 0;
		padding: 7px 5px;
		width: 100%;
		height: 35px;
		border: 1px solid #666;
		background-color: #000;
		font-size: 16px;
		color: #fff;
	}

	#menu_sp .search_sp .btn {
		position: absolute;
		right: 0;
		top: 0;
		padding: 15px 0;
		background-color: #999;
	}

	/* gnav
	----------------*/

	#gnav_sp ul {
		padding: 0 25px;
	}

	#gnav_sp li {
		font-size:15px; /* テキスト配置の場合 */
	}

	#gnav_sp span.open {
		cursor: pointer;
	}

	#gnav_sp a,
	#gnav_sp span {
		display: block;
		/*padding: 15px 0 20px 35px;*/
		padding: 20px 0 15px 35px; /* テキスト配置の場合 */
		border: 1px solid #666;
		border-top: none;
		background: url(../images/sp/gnav_arrow1.png) no-repeat right 18px;
	}

	#gnav_sp span.on {
		background: url(../images/sp/gnav_arrow2.png) no-repeat right 18px;
	}

	#gnav_sp li.first a,
	#gnav_sp li.first span {
		border-top: 1px solid #666;
		color:#929292; /* テキスト配置の場合 */
	}

	#gnav_sp li ul {
		display: none;
		padding: 0;
		border: 1px solid #666;
		border-top: none;
	}

	#gnav_sp li li a {
		padding: 12px 0 12px 35px;
		border: none;
		background: none;
		font-size:13px; /* テキスト配置の場合 */
	}

	#gnav_sp li li.first a {
		border: none;
		padding-top: 22px;
	}

	#gnav_sp li li.last a {
		padding-bottom: 22px;
	}

	#gnav_sp li.first li a {
		border: none;
	}

	/* fnav1_sp
	----------------*/

	#fnav1_sp {
		margin-bottom: 40px;
	}

	#fnav1_sp ul {
		padding: 0 25px;
	}

	#fnav1_sp ul li {
		float: none;
		margin: 0;
	}

	#fnav1_sp ul li ul {
		float: none;
	}

	#fnav1_sp span.open {
		cursor: pointer;
	}

	#fnav1_sp li a,
	#fnav1_sp li span {
		display: block;
		line-height: 1.5;
		margin: 0;
		padding: 15px 0 20px 35px;
		border: 1px solid #666;
		border-top: none;
		background: url(../images/sp/gnav_arrow1.png) no-repeat right 18px;
		color: #999;
		font-size: 16px;
	}

	#fnav1_sp span.on {
		background: url(../images/sp/gnav_arrow2.png) no-repeat right 18px;
	}

	#fnav1_sp li.first a,
	#fnav1_sp li.first span {
		border-top: 1px solid #666;
	}

	#fnav1_sp li ul {
		display: none;
		padding: 0;
		border: 1px solid #666;
		border-top: none;
	}

	#fnav1_sp li li a {
		padding: 12px 0 12px 35px;
		border: none;
		background: none;
		font-size: 14px;
	}

	#fnav1_sp li li.first a {
		padding-top: 22px;
	}

	#fnav1_sp li li.last a {
		padding-bottom: 22px;
	}

	#fnav1_sp li.first li a {
		border: none;
	}

	#fnav2 {
		float: none;
	}

	#footer .copyright {
		float: none;
	}

	#menu_sp .menu_btn_sp a {
		display: block;
		padding: 5px;
	}
}