@charset "shift_jis";

/* ========================================
	base
======================================== */
html,
body {
	height: 100%;
	background: url(../../../../common/img/bg.gif) center top repeat;
}
#wrapper {
	position: relative;
	width: 100%;
	min-width: 930px;
	overflow: hidden;
	background: url(../../../../common/img/header_bg.gif) center top repeat-x;
}
.inner {
	position: relative;
	max-width: 1146px;
	min-width: 930px;
	width: 100%;
	margin: 0 auto;
}

/* ====================
	#header
==================== */
#header{
	margin-bottom:0;
}
/*#index-header {
	position: relative;
	z-index: 200;
	width: 100%;
	background: url(../../../../common/img/header_line.png) center bottom repeat-x;
}
#index-header .inner {
	padding-top: 25px;
	height: 38px;
}
#index-header .header-logo {
	float: left;
}
#index-header .header-btn {
	float: right;
}*/

/* ====================
	#footer
==================== */
#footer {
	position: relative;
	z-index: 200;
	width: 100%;
	background: url(../../../../common/img/footer_bg.gif) center bottom repeat-x;
}
#footer #footer-nav {
	height: 40px;
	padding-top: 20px;
	background: url(../../../../common/img/footer_line.png) center top repeat-x;
}
#footer-nav #fNav {
	float: left;
}
#footer-nav #fNav li {
	float: left;
	padding-right: 27px;
}
#footer-nav .footer-pagetop {
	float: right;
}

/* ====================
	#copyright
==================== */
#copyright{
	width: 100%;
	padding: 6px 0;
	background: #EFEFEF;
	text-align: center;
}

/* ========================================
	#modal
======================================== */
#coverLayer {
	display: none;
	position: fixed;
	top: 0;
	left: 0;
	z-index: 9999;
	width: 100%;
	height: 100%;
	min-height: 100%;
	background: #FFF;
	opacity: 0.8;
	filter: alpha(opacity=80);
	-ms-filter: "alpha(opacity=80)";
	cursor: pointer;
}
#modal {
	position: absolute;
	z-index: 9999;
	left: 50%;
}
#modal #modal-close a {
	position: absolute;
	top: 0;
	right: 50px;
	width: 37px;
	height: 57px;
	background: url(../../img/kirby/modal_close_off.png) center center no-repeat;
}
#modal #modal-close a:hover {
	background: url(../../img/kirby/modal_close_on.png) center center no-repeat;
}
#modalBody {
	background: transparent;
	max-width: 1010px;
	min-width: 930px;
	width: 100%;
}
#modalBody .modal-mainimage img {
	width: 100%;
	height: auto;
}
#modalBody .modal-arw {
	background: #ff0;
}
#modalBody .modal-arw li {
	float: left;
	width: 50%;
}
#modalBody .modal-arw li.modal-arw-left {
	float: left;
	width: 50%;
	text-align: right;
}
#modalBody .modal-arw li.modal-arw-right {
	float: right;
	width: 50%;
}

/* ====================
	#contents
==================== */
#contents {
	width: 100%;
	background: url(../../img/kirby/bg_contents.gif);
	padding-bottom:0;
}
#contents .contents-wrap {
	position: relative;
	max-width: 1146px;
/*	min-width: 960px;*/
	min-width: 930px;
	width: 100%;
	margin: 0 auto;
}
.clearfix:after {
	content: '';
	display: block;
	clear: both;
}

/* h1 */
#contents h1 img {
	width: 100%;
	height: auto;
}

/* contents */
#contents .block-left,
#contents .block-right {
	float: left;
	width: 50%;
}
#contents .block-left img,
#contents .block-right img {
	width: 100%;
	height: auto;
}

/* main-visual */
#contents .main-visual {
	max-width: none;
	margin-bottom: 10px;
}
#contents .main-visual p img {
	width: 100%;
	height: auto;
}
#contents .main-visual p.btn {
	width: 80.2%;
	margin: -12.25% auto 0;
}

/* article01 */
#contents .article01 {
	position: relative;
}
#contents .article01 .wrap {
	position: relative;
	min-width: 930px;
	width: 100%;
	height: auto;
	margin: 0 auto;
	text-align: center;
}
#contents .article01 .wrap p img {
	width: 100%;
	height: auto;
}
#contents .article01 .wrap02 {
	position: relative;
	width: 100%;
	max-width: 1146px;
	margin: 0 auto;
}
#contents .article01 ul.btn-area {
	width: 100%;
	max-width: 1146px;
	margin: 0 auto;
}
#contents .article01 ul.btn-area li {
	float: left;
	width: 50%;
}
#contents .article01 ul.btn-area li img {
	width: 100%;
	height: auto;
}
#contents .article01 .wrap02 #chara01 {
	position: absolute;
	top: -186px;
	right: -193px;
}
#contents .article01 .wrap02 #chara02 {
	position: absolute;
	bottom: 140px;
	left: -236px;
}
#contents .article01 .wrap02 #chara03 {
	position: absolute;
	bottom: -56px;
	right: -257px;
}

/* article02 */
#contents .article02 {
	position: relative;
}
#contents .article02 .wrap {
	position: relative;
	min-width: 930px;
	width: 100%;
	height: auto;
	margin: 0 auto;
	text-align: center;
	z-index: 10;
}
#contents .article02 .wrap p {
	max-width: 100%;
}
#contents .article02 .wrap p img {
	width: 100%;
	height: auto;
}
#contents .article02 .img-area {
	position: relative;
	min-width: 930px;
	width: 100%;
	margin: -4% auto 0;
	z-index: 0;
}
#contents .article02 .img-area img {
	width: 100%;
	min-width: 930px;
	height: auto;
}
#contents .article02 .package {
	position: relative;
	width: 73.75%;
/*	max-width: 1175px;*/
	min-width: 930px;
	margin: -6% auto 0;
	z-index: 20;
}
#contents .article02 .package p {
	float: left;
	width: 81.28%;
}
#contents .article02 .package img {
	width: 100%;
	height: auto;
}
#contents .article02 .package .btn {
	float: left;
	width: 18.72%;
	margin: 11% 0 0;
}

/* article03 */
#contents .article03 {
	position: relative;
	z-index: 30;
}
#contents .article03 .wrap {
	position: relative;
	widows: 100%;
	min-width: 930px;
	margin: 0 auto;
}
#contents .article03 .wrap img {
	width: 100%;
	height: auto;
}
#contents .article03 .wrap .chara-oheya {
	float: left;
	width: 37.28%;
}
#contents .article03 .wrap .text {
	float: left;
	width: 62.72%;
}
#contents .article03 .wrap .btn-area {
	position: relative;
	float: left;
	width: 62.72%;
}
#contents .article03 .wrap .btn-area ul {
	position: absolute;
	width: 77.86%;
/*	max-width: 760px;*/
	top: 0;
	left: 0;
}
#contents .article03 .wrap .btn-area ul.line02 {
	top: 39%;
	left: 9%;
}
#contents .article03 .wrap .btn-area ul li {
	float: left;
	width: 25%;
}

/* article04 */
#contents .article04 {
	position: relative;
	margin: -5% 0 0;
	background: url(../../img/kirby/article04_bg.png) repeat left top;
	z-index: 0;
}
#contents .article04 p.ttl {
	padding: 5% 0 0;
	text-align: center;
	max-width: none;
}
#contents .article04 p.ttl img {
	width: 100%;
	height: auto;
}
#contents .article04 .slide-area {
}
#contents .article04 .slide-area .slide-area-inner {
	position: relative;
	width: 286px;
	margin: 0 auto;
}
#contents .article04 .slide-area .slide-area-inner2 {
	position: relative;
	left: -1144px;
	width: 7722px;
}
#contents .article04 .slide-area .layer-left {
	position: absolute;
	top: 0;
	left: 0;
	width: 1144px;
	height: 858px;
	background: #F4F1E2;
	opacity: 0.8;
	filter: alpha(opacity=80);
	-ms-filter: "alpha(opacity=80)";
	z-index: 100;
}
#contents .article04 .slide-area .layer-right {
	position: absolute;
	top: 0;
	left: 1430px;
	width: 2860px;
	height: 858px;
	background: #F4F1E2;
	opacity: 0.8;
	filter: alpha(opacity=80);
	-ms-filter: "alpha(opacity=80)";
	z-index: 100;
}
#contents .article04 .slide-area .bx-prev,
#contents .article04 .slide-area .bx-next {
	text-indent: -9999px;
	z-index: 1000;
}
#contents .article04 .slide-area .bx-prev {
	position: absolute;
	top: 350px;
	left: 912px;
	width: 213px;
	height: 212px;
	background: url(../../img/kirby/article04_prev_off.png) no-repeat left top;
}
#contents .article04 .slide-area .bx-prev:hover {
	background: url(../../img/kirby/article04_prev_on.png) no-repeat left top;
}
#contents .article04 .slide-area .bx-next {
	position: absolute;
	top: 350px;
	left: 1446px;
	width: 213px;
	height: 212px;
	background: url(../../img/kirby/article04_next_off.png) no-repeat left top;
}
#contents .article04 .slide-area .bx-next:hover {
	background: url(../../img/kirby/article04_next_on.png) no-repeat left top;
}
.bx-wrapper {
	max-width: none!important;
}

/* article05 */
#contents .article05 {
	position: relative;
	background: #E46180;
}
#contents .article05 img {
	width: 100%;
	height: auto;
}
#contents .article05 .text01 {
	float: left;
	width: 52.76%;
}
#contents .article05 .text02 {
	float: left;
	width: 47.24%;
}
#contents .article05 .btn-area {
	position: relative;
	max-width: none;
}
#contents .article05 .btn-area p.btn {
	position: absolute;
	top: 0;
	left: 21.49%;
	width: 52.0%;
}
#contents .article05 #chara04 {
	position: absolute;
	top: 15%;
	left: 0.64%;
	width: 10.55%;
	height: auto;
}
#contents .article05 #chara05 {
	position: absolute;
	bottom: 7%;
	left: 11.84%;
	width: 9.9%;
	height: auto;
}
#contents .article05 #chara06 {
	position: absolute;
	top: 7%;
	right: 5.6%;
	width: 13.7%;
	height: auto;
}
#contents .article05 #chara07 {
	position: absolute;
	bottom: 7%;
	right: 14.41%;
	width: 10.3%;
	height: auto;
}

/* article06 */
#contents .article06 {
	position: relative;
	text-align: center;
	background: #FFF;
}
#contents .article06 img {
	width: 75.68%;
	height: auto;
}

/* article07 */
#contents .article07 {
	position: relative;
	text-align: center;
	background: #FFF;
}
#contents .article07 img {
	width: 100%;
	height: auto;
}
#contents .article07 p.btn {
	position: absolute;
	bottom: 12%;
	left: 39%;
	width: 22.78%;
}

/* ====================
	max-width 960px
==================== */
@media only screen and (max-width: 985px) {
#index-header .header-logo {
	padding-left: 25px;
}
#index-header .header-btn {
	padding-right: 25px;
}
#footer-nav #fNav {
	padding-left: 25px;
}
#footer-nav .footer-pagetop {
	padding-right: 25px;
}
#contents h1 {
	padding-left: 10px;
	padding-right: 10px;
}
#copyright p {
	padding-left: 25px;
	padding-right: 25px;
}
#contents .contents-wrap {
	min-width: 1146px;
	margin: 0 -108px;
}
#contents .article01 .wrap {
	min-width: 1264px;
	margin: 0 -167px;
}
#contents .article02 .wrap {
	min-width: 1264px;
	margin: 0 -167px;
}
#contents .article02 .img-area {
	min-width: 1264px;
	margin: -4% -167px 0;
}
#contents .article03 .wrap {
	min-width: 1264px;
	margin: 0 -167px;
}
#contents .article05 .wrap {
	min-width: 1264px;
	margin: 0 -167px;
}
#contents .article05 .btn-area {
	min-width: 1264px;
	margin: 0 -167px;
}
#contents .article05 #chara05 {
	bottom: 7%;
	left: -1.5%;
	width: 13.44%;
	height: auto;
}
#contents .article05 #chara07 {
	bottom: 7%;
	right: -0.5%;
	width: 13.98%;
	height: auto;
}
#modal {
	width: 930px !important;
	margin-left: -465px !important;
}
iframe#popInner {
	width: 930px !important;
}
} /* max-width 985px END */

/* ====================
	max-width 1188px
==================== */
@media screen and (min-width: 981px) and (max-width: 1208px) {
#index-header .header-logo {
	padding-left: 25px;
}
#index-header .header-btn {
	padding-right: 25px;
}
#footer-nav #fNav {
	padding-left: 25px;
}
#footer-nav .footer-pagetop {
	padding-right: 25px;
}
#contents h1 {
	padding-left: 10px;
	padding-right: 10px;
}
} /* max-width 1208px END */

/* ====================
	min-width 1189px
==================== */
@media screen and (min-width: 1209px) {
#index-header .header-logo {
	padding-left: 10px;
}
#index-header .header-btn {
	padding-right: 33px;
}
#footer-nav #fNav {
	padding-left: 10px;
}
#footer-nav .footer-pagetop {
	padding-right: 33px;
}
} /* min-width 1209px END */