@charset "utf-8";

/**************************************************
		PC
**************************************************/
#home #headerWrapper {
	margin-bottom:40px;
}

#home #headerArea {
	min-height:466px;
}

#contWrapper {
	overflow:hidden;
}


/* ===== Main Image ===== */
#home #mainImage {
	min-height:466px;
}

#mainImage .button {
	position:absolute;
	top:51%;
	left:8.7%;
	z-index:200;
}

#mainImage .slider {
	position:relative;
	width:100%;
	font-size:0.8em;
}

#mainImage .slider li {
	position:absolute;
	top:0;
	left:0;
	width:100%;
}

#mainImage .bx-wrapper {
	position:relative;
	min-height:466px;
	*zoom:1;
}

#mainImage .bx-wrapper img {
	max-width:100%;
	display:block;
}

#mainImage .bx-wrapper .bx-viewport {}

#mainImage .bx-wrapper .bx-loading {
	position:absolute;
	top:0;
	left:0;
	width:100%;
	height:100%;
	min-height:466px;
	background:transparent url("../common/img/img_loader.gif") 50% 50% no-repeat;
	z-index:2000;
}

#mainImage .bx-wrapper .bx-pager {
	position:absolute;
	left:0;
	bottom:20px;
	width:100%;
	height:19px;
	text-align:center;
	z-index:200;
}

#mainImage .bx-wrapper .bx-pager .bx-pager-item {
	display:inline-block;
	*zoom:1;
	*display:inline;
}

#mainImage .bx-wrapper .bx-pager .bx-pager-item a {
	display:block;
	float:left;
	width:19px;
	height:19px;
	background:transparent url("../img/bt_slider_main.png") 0 0 no-repeat;
	text-indent:-9999px;
	overflow:hidden;
}

#mainImage .bx-wrapper .bx-pager .bx-pager-item a:hover,
#mainImage .bx-wrapper .bx-pager .bx-pager-item a.active { background-position:0 -19px; }


/* =========== Recommend Area ========== */
#recommendArea {
	clear:both;
	position:relative;
	margin-bottom:30px;
	width:100%;
}

#recommendArea .title {
	margin-bottom:7px;
	font-size:0.8em;
}

#recommendArea .slider {
	font-size:0.8em;
	/*width:9000%;*/
}

#recommendArea .slider li {
	float:left;
}

#recommendArea .slider li a {
	display:block;
	padding:5px 5px 13px 5px;
	background:transparent url("../img/bg_pickup.png") 0 0 no-repeat;
}

#recommendArea .slider li a:hover {
	background:transparent url("../img/bg_pickup_on.png") 0 0 no-repeat;
}

#recommendArea .slider li .noLink {
	display:block;
	padding:5px 5px 13px 5px;
	background:transparent url("../img/bg_pickup.png") 0 0 no-repeat;
}

#recommendArea .bx-wrapper {
	position:relative;
	height:224px;
	*zoom:1;
}

#recommendArea .bx-wrapper img {
	max-width:100%;
	display:block;
}

#recommendArea .bx-wrapper .bx-viewport {
	position:relative;
	z-index:20;
}

#recommendArea .bx-wrapper .bx-loading {
	position:absolute;
	top:0;
	left:0;
	width:100%;
	height:100%;
	min-height:200px;
	background:transparent url("../common/img/img_loader.gif") 50% 50% no-repeat;
	z-index:30;
}

#recommendArea .bx-wrapper .bx-controls {
	position:absolute;
	top:0;
	left:0;
	width:100%;
	z-index:10;
}

#recommendArea .bx-wrapper .bx-pager {
	position:absolute;
	top:205px;
	width:100%;
	height:19px;
	text-align:center;
}

#recommendArea .bx-wrapper .bx-pager .bx-pager-item {
	display:inline-block;
	*zoom:1;
	*display:inline;
}

#recommendArea .bx-wrapper .bx-pager .bx-pager-item a {
	display:block;
	float:left;
	width:19px;
	height:19px;
	background:transparent url("../img/bt_slider.gif") 0 0 no-repeat;
	text-indent:-9999px;
	overflow:hidden;
}

#recommendArea .bx-wrapper .bx-pager .bx-pager-item a:hover,
#recommendArea .bx-wrapper .bx-pager .bx-pager-item a.active { background-position:0 -19px; }

#recommendArea .bx-wrapper .bx-controls-direction {
	position:absolute;
	width:100%;
	height:200px;
}

#recommendArea .bx-wrapper .bx-controls-direction a {
	display:block;
	position:absolute;
	top:50%;
	margin-top:-28px;
	width:20px;
	height:37px;
	text-indent:-9999px;
	z-index:9999;
	overflow:hidden;
}

#recommendArea .bx-wrapper .bx-controls-direction a.disabled {
	display:none;
}

#recommendArea .bx-wrapper .bx-prev {
	left:-45px;
	background:transparent url("../img/bt_prev.gif") 0 0 no-repeat;
}

#recommendArea .bx-wrapper .bx-next {
	right:-45px;
	background:transparent url("../img/bt_next.gif") 0 0 no-repeat;
}

#recommendArea .bx-wrapper .bx-prev:hover,
#recommendArea .bx-wrapper .bx-next:hover { background-position:0 -37px; }


/* =========== Event ========== */
#mainArea #eventArea {
	clear:both;
	margin-bottom:47px;
	width:100%;
}

#mainArea #eventArea .title {
	margin-bottom:13px;
	padding-bottom:12px;
	background:transparent url("../../common/img/ti_003.gif") 0 100% repeat-x;
	font-size:0.8em;
}

#mainArea #eventArea .more {
	margin:-43px 0 20px 0;
	font-size:0.8em;
	text-align:right;
}

#mainArea #eventArea .more li {
	display:inline;
}

#mainArea #eventArea .eventBox {
	clear:both;
	margin-bottom:15px;
	padding-bottom:16px;
	width:100%;
	background:transparent url("../img/bg_event.gif") 0 100% no-repeat;
}

#mainArea #eventArea .lastBox {
	margin-bottom:0;
	padding-bottom:0;
	background-image:none;
}

#mainArea #eventArea .eventBox .leftBox {
	float:left;
	width:325px;
}

#mainArea #eventArea .eventBox .rightBox {
	float:right;
	margin-left:30px;
	width:325px;
}

#mainArea #eventArea .eventBox .leftItem {
	float:left;
	width:80px;
}

#mainArea #eventArea .eventBox .rightItem {
	float:right;
	margin-left:15px;
	width:230px;
}

#mainArea #eventArea .eventBox .subtitle {
	margin-bottom:7px;
	line-height:1.5;
}

#mainArea #eventArea .eventBox .subtitle .date {
	display:block;
	font-size:0.7em;
	font-weight:normal;
}

#mainArea #eventArea .eventBox .subtitle .text {
	display:block;
	font-size:0.8em;
	font-weight:normal;
}

#mainArea #eventArea .eventBox p {
	margin-bottom:0;
	font-size:0.7em;
	line-height:1.5;
}

#mainArea #eventArea .eventBox .image {
	margin-bottom:3px;
}


#mainArea #eventArea .listSocial {
	font-size:0.7em;
}

#mainArea #eventArea .listSocial li {
	float:left;
	margin-right:1px;
}

#mainArea #eventArea .listSocial .right {
	margin-right:0;
}


/* =========== Info ========== */
#mainArea #infoArea {
	clear:both;
	margin-bottom:47px;
	width:100%;
}

#mainArea #infoArea .title {
	margin-bottom:13px;
	padding-bottom:12px;
	background:transparent url("../../common/img/ti_003.gif") 0 100% repeat-x;
	font-size:0.8em;
}

#mainArea #eventArea .more {
	margin:-43px 0 20px 0;
	font-size:0.8em;
	text-align:right;
}

#mainArea #infoArea .more {
	margin:-43px 0 20px 0;
	font-size:0.8em;
	text-align:right;
}

#mainArea #infoArea .more li {
	display:inline;
}

#mainArea .listInfo {
	margin-bottom:17px;
	font-size:0.8em;
}

#mainArea .listInfo li {
	margin-bottom:9px;
	padding:0 5px 10px 5px;
	background:transparent url("../common/img/border_dotted.gif") 0 100% repeat-x;
	line-height:1.6;
}

#mainArea .listInfo li .infoDate {
	display:block;
	width:6em;
}

#mainArea .listInfo li .infoTitle {
	display:block;
	margin:-1.6em 0 0 7em;
	padding-left:10px;
	background:transparent url("../common/img/icon_002.gif") 0 0.6em no-repeat;
}

#mainArea #infoArea li.lastItem { margin-bottom:0; }


/* =========== Calendar ========== */
.calndarArea {
	clear:both;
	margin-bottom:47px;
	width:100%;
}

.calndarArea .title {
	margin-bottom:7px;
	font-size:1em;
}

.calndarArea iframe {
	display:block;
	margin:0 auto;
	max-width:100%;
}


/* =========== Facebook ========== */
#mainArea #fbArea {
	clear:both;
	margin-bottom:47px;
	width:100%;
}

#mainArea #fbArea .title {
	margin-bottom:0;
	font-size:0.8em;
}

#mainArea #fbArea .fbBox {
	padding:15px;
	background:transparent url("../img/bg_pr.gif") 0 0 repeat;
	text-align:center;
}


/* =========== PR ========== */
.prArea {
	clear:both;
	margin-bottom:17px;
	width:100%;
}

.prArea .title {
	margin-bottom:7px;
	font-size:0.8em;
}

.prArea ul {
	padding:10px 0 0 40px;
	font-size:0.8em;
	background:transparent url("../img/bg_pr.gif") 0 0 repeat;
}

.prArea ul li {
	float:left;
	margin:0 20px 10px 0;
	width:200px;
	background-color:#FFF;
	text-align:center;
}


/**************************************************
		SP
**************************************************/
@media screen and (max-width:767px){

#home #headerWrapper {
	margin-bottom:0;
}

#home #headerArea {
	min-height:initial;
	min-height:auto;
}

#contWrapper {
	padding-top:30px;
}

#sideArea {
	margin-bottom:40px;
}


/* ===== Main Image ===== */
#home #mainImage {
	min-height:initial;
	min-height:auto;
}

#mainImage .button {
	display:none;
}

#mainImage .bx-wrapper {
	height:auto;
	min-height:initial;
	min-height:auto;
}

#mainImage .bx-wrapper .bx-loading {
	min-height:100px;
}

#mainImage .bx-wrapper .bx-pager {
	left:auto;
	right:10px;
	bottom:10px;
	width:auto;
	height:7px;
}

#mainImage .bx-wrapper .bx-pager .bx-pager-item a {
	width:7px;
	height:7px;
	-webkit-background-size:7px auto;
	-moz-background-size:7px auto;
	-ms-background-size:7px auto;
	-o-background-size:7px auto;
	background-size:7px auto;
}

#mainImage .bx-wrapper .bx-pager .bx-pager-item a:hover { background-position:0 0; }
#mainImage .bx-wrapper .bx-pager .bx-pager-item a.active { background-position:0 -7px; }


/* =========== Recommend Area ========== */
#recommendArea {
	margin-bottom:40px;
}

#recommendArea .title {
	margin:0 20px 10px 20px;
}

#recommendArea .bx-wrapper {
	width:100%;
	height:auto;
}

#recommendArea .bx-wrapper .bx-viewport {
	margin:0 auto 15px auto;
	width:50% !important;
	overflow:visible !important;
}

#recommendArea .slider li {
	margin-right:10px !important;
}

#recommendArea .slider li a,
#recommendArea .slider li .noLink {
	padding:3px 3px 7px 3px;
	-webkit-background-size:100% auto;
	-moz-background-size:100% auto;
	-ms-background-size:100% auto;
	-o-background-size:100% auto;
	background-size:100% auto;
}

#recommendArea .slider li a:hover {
	background-image:url("../img/bg_pickup.png");
	-webkit-background-size:100% auto;
	-moz-background-size:100% auto;
	-ms-background-size:100% auto;
	-o-background-size:100% auto;
	background-size:100% auto;
}

#recommendArea .bx-wrapper .bx-controls {
	position:relative;
	height:19px;
}

#recommendArea .bx-wrapper .bx-pager {
	top:0;
	padding:6px 40px;
	height:7px;
}

#recommendArea .bx-wrapper .bx-pager .bx-pager-item a {
	width:7px;
	height:7px;
	background:transparent url("../img/bt_slider.gif") 0 0 no-repeat;
	-webkit-background-size:7px auto;
	-moz-background-size:7px auto;
	-ms-background-size:7px auto;
	-o-background-size:7px auto;
	background-size:7px auto;
}

#recommendArea .bx-wrapper .bx-pager .bx-pager-item a:hover { background-position:0 0; }
#recommendArea .bx-wrapper .bx-pager .bx-pager-item a.active { background-position:0 -7px; }

#recommendArea .bx-wrapper .bx-controls-direction {
	height:19px;
}

#recommendArea .bx-wrapper .bx-controls-direction a {
	top:0;
	margin-top:0;
	width:10px;
	height:19px;
}

#recommendArea .bx-wrapper .bx-prev {
	left:20px;
	-webkit-background-size:10px auto;
	-moz-background-size:10px auto;
	-ms-background-size:10px auto;
	-o-background-size:10px auto;
	background-size:10px auto;
}

#recommendArea .bx-wrapper .bx-next {
	right:20px;
	-webkit-background-size:10px auto;
	-moz-background-size:10px auto;
	-ms-background-size:10px auto;
	-o-background-size:10px auto;
	background-size:10px auto;
}

#recommendArea .bx-wrapper .bx-prev:hover,
#recommendArea .bx-wrapper .bx-next:hover { background-position:0 0; }


/* =========== Event ========== */
#mainArea #eventArea {
	margin-bottom:40px;
}

#mainArea #eventArea .title {
	margin-bottom:0;
	background-image:url("../common/img/ti_003_sp.gif");
	-webkit-background-size:auto 2px;
	-moz-background-size:auto 2px;
	-ms-background-size:auto 2px;
	-o-background-size:auto 2px;
	background-size:auto 2px;
}

#mainArea #eventArea .more2 {
	margin:0 20px;
}

#mainArea #eventArea .eventBox {
	margin-bottom:0;
	padding-bottom:0;
	background:none;
}

#mainArea #eventArea .lastBox {
	margin-bottom:20px;
}

#mainArea #eventArea .eventBox .leftBox,
#mainArea #eventArea .eventBox .rightBox {
	clear:both;
	float:none;
	margin:0;
	padding:15px 0;
	width:auto;
	background:transparent url("../img/bg_event_sp.gif") 0 100% no-repeat;
	-webkit-background-size:100% auto;
	-moz-background-size:100% auto;
	-ms-background-size:100% auto;
	-o-background-size:100% auto;
	background-size:100% auto;
}

#mainArea #eventArea .eventBox .bg {
	padding-right:20px;
	background:transparent url("../common/img/icon_004_sp.gif") 100% 50% no-repeat;
	-webkit-background-size:12px auto;
	-moz-background-size:12px auto;
	-ms-background-size:12px auto;
	-o-background-size:12px auto;
	background-size:12px auto;
	overflow:hidden;
}

#mainArea #eventArea .eventBox .leftItem {
	float:left;
	width:30%;
}

#mainArea #eventArea .eventBox .rightItem {
	float:right;
	margin:0;
	padding-left:15px;
	width:70%;
}

#mainArea #eventArea .eventBox .subtitle {
	margin-bottom:7px;
	line-height:1.5;
}

#mainArea #eventArea .eventBox .subtitle .date {
	font-size:0.69em;
}

#mainArea #eventArea .eventBox .subtitle .text {
	font-size:1em;
}

#mainArea #eventArea .eventBox .subtitle a {
	display:block;
}

#mainArea #eventArea .eventBox .image {
	margin-bottom:0;
}


/* =========== Info ========== */
#mainArea #infoArea {
	margin-bottom:40px;
}

#mainArea #infoArea .title {
	margin-bottom:0;
	background-image:url("../common/img/ti_003_sp.gif");
	-webkit-background-size:auto 2px;
	-moz-background-size:auto 2px;
	-ms-background-size:auto 2px;
	-o-background-size:auto 2px;
	background-size:auto 2px;
}

#mainArea #infoArea .more2 {
	margin:0 20px;
}

#mainArea .listInfo {
	margin-bottom:20px;
	font-size:1em;
}

#mainArea .listInfo li {
	margin-bottom:0;
	padding:15px 0 15px 10px;
	border-bottom:1px dotted #adacab;
	background:none;
	line-height:1.5;
}

#mainArea .listInfo li .bg {
	display:block;
	padding-right:20px;
	background:transparent url("../common/img/icon_004_sp.gif") 100% 50% no-repeat;
	-webkit-background-size:12px auto;
	-moz-background-size:12px auto;
	-ms-background-size:12px auto;
	-o-background-size:12px auto;
	background-size:12px auto;
}

#mainArea .listInfo li .infoDate {
	display:block;
	width:auto;
	font-size:0.69rem;
}

#mainArea .listInfo li .infoTitle {
	display:block;
	margin:0;
	padding:0;
	background:none;
}

#mainArea .listInfo li a {
	display:block;
}


/* =========== Calendar ========== */
.calndarArea {
	position:relative;
	margin-bottom:40px;
}


/* =========== PR ========== */
.prArea {
	margin:0 20px;
	width:auto;
}

.prArea .title {
	margin-bottom:7px;
	font-size:0.82em;
}

.prArea .slider {}

.prArea .slider .sliderCont {
	float:left;
	padding:0 30px;
}

.prArea ul {
	padding:0;
	background:none;
}

.prArea ul li {
	float:left;
	margin:0;
	padding:5px;
	width:50%;
	background:transparent
}

.prArea .bx-wrapper {
	position:relative;
	*zoom:1;
}

.prArea .bx-wrapper img {
	display:block;
	max-width:100%;
}

.prArea .bx-wrapper .bx-viewport {
	position:relative;
	padding:5px 0;
	background:transparent url("../img/bg_pr.gif") 0 0 repeat;
	-webkit-background-size:50px auto;
	-moz-background-size:50px auto;
	-ms-background-size:50px auto;
	-o-background-size:50px auto;
	background-size:50px auto;
	-webkit-box-sizing:content-box;
	-moz-box-sizing:content-box;
	-ms-box-sizing:content-box;
	-o-box-sizing:content-box;
	box-sizing:content-box;
	z-index:20;
}

.prArea .bx-wrapper .bx-loading {
	position:absolute;
	top:0;
	left:0;
	width:100%;
	height:100%;
	min-height:100px;
	background:transparent url("../common/img/img_loader.gif") 50% 50% no-repeat;
	z-index:30;
}

.prArea .bx-wrapper .bx-pager {
	position:relative;
	margin-top:9px;d
	width:100%;
	text-align:center;
}

.prArea .bx-wrapper .bx-pager .bx-pager-item {
	display:inline-block;
	*zoom:1;
	*display:inline;
}

.prArea .bx-wrapper .bx-pager .bx-pager-item a {
	display:block;
	float:left;
	width:7px;
	height:7px;
	background:transparent url("../img/bt_slider.gif") 0 0 no-repeat;
	-webkit-background-size:7px auto;
	-moz-background-size:7px auto;
	-ms-background-size:7px auto;
	-o-background-size:7px auto;
	background-size:7px auto;
	text-indent:-9999px;
	overflow:hidden;
}

.prArea .bx-wrapper .bx-pager .bx-pager-item a.active { background-position:0 -7px; }

.prArea .bx-wrapper .bx-controls-direction a {
	display:block;
	position:absolute;
	top:50%;
	margin-top:-14px;
	width:10px;
	height:19px;
	text-indent:-9999px;
	z-index:9999;
	overflow:hidden;
}

.prArea .bx-wrapper .bx-controls-direction a.disabled {
	display:none;
}

.prArea .bx-wrapper .bx-prev {
	left:10px;
	background:transparent url("../img/bt_prev.gif") 0 0 no-repeat;
	-webkit-background-size:10px auto;
	-moz-background-size:10px auto;
	-ms-background-size:10px auto;
	-o-background-size:10px auto;
	background-size:10px auto;
}

.prArea .bx-wrapper .bx-next {
	right:10px;
	background:transparent url("../img/bt_next.gif") 0 0 no-repeat;
	-webkit-background-size:10px auto;
	-moz-background-size:10px auto;
	-ms-background-size:10px auto;
	-o-background-size:10px auto;
	background-size:10px auto;
}

}
