@charset "utf-8";

/*----------------*/

/* float */
#MainContents .hotel .l { float:left; }
#MainContents .hotel .r { float:right; }

/* clear */
.clear { clear:both; }

/* clearFix */
.clearfix:after { content: ""; clear: both; display: block;}

/*----------------*/


/* hotel ==== */
#MainContents .hotel {
	background-color: #f4f4f4;
	padding:100px 0;
}
#MainContents .hotel section {
	width: 960px;
	margin: 50px auto 0;
	padding:50px;
	background: #FFF;
}

/* hotel01 */
.hotel01 .l,
.hotel01 .r { width:470px; }

/* hotel_info */
.hotel_info {position:relative;}
.hotel_info h1 { font-size:18px; line-height:32px; margin-bottom:30px; float:left; }
.hotel_info .prt_btn01 { margin-top:15px; position:absolute; right:0; top:-18px;}
.hotel_info .clear { font-size:14px; }
.hotel_info .clear li { padding:1em 0; border-top:1px solid #ededed; text-align:right; }
.hotel_info .clear li strong { float:left; }
.hotel_info .clear li:first-child { padding-top:0; border:0; }
.hotel_info .clear li:last-child  { padding-bottom:0; }

/* activity ==== */
/* wrap */
#MainContents .activity {
	width:1060px;
	margin:0 auto;
	padding:100px 0;
}
#MainContents .activityBox {
	margin-top:50px;
	padding: 0 0 0 30px;
}
/* box */
.activityBox .in {
	width:230px;
    margin: 0 27px 50px 0;
    padding: 0 0 70px;
    background-color: #fff;
    position: relative;
    float: left;
}
.activityBox h2       { line-height:1.0em; }
.activityBox h3       { line-height:1.0em; font-size:16px; margin-bottom:20px; padding-bottom:20px; border-bottom:1px solid #ededed; }
.activityBox h4       { line-height:1.6em; font-size:15px; }
.activityBox p        { line-height:1.6em; font-size:15px; margin-bottom:10px; text-align:justify; }
.activityBox .in span { line-height:1.6em; font-size:13px; }
.activityBox .in ul   { padding-left:2em; margin-bottom:10px; }
.activityBox .in li   { line-height:1.4em; font-size:13px; list-style:disc; }
/* tag */
.activityBox .tag {
    width: 80px;
    height: 80px;
    position: absolute;
    left: 0;
    top: 0;
}
.activityBox .tag:before {
    content: "";
    display: block;
    width: 0;
    height: 0;
    border-bottom: 80px solid transparent;
    border-left: 80px solid;
    border-left-color: #fff003;
}
.activityBox .tag span img {
    display: block;
    text-align: center;
    margin: auto;
    position: absolute;
    top: -20px;
    bottom: 0;
    right: -80px;
    left: -100px;
    -webkit-transform: rotate(-45deg);
    transform: rotate(-45deg);
}

.activityBox .tag02 {
    width: 80px;
    height: 80px;
    position: absolute;
    left: 0;
    top: 0;
}
.activityBox .tag02:before {
    content: "";
    display: block;
    width: 0;
    height: 0;
    border-bottom: 80px solid transparent;
    border-left: 80px solid;
    border-left-color: #03c1ff;
}
.activityBox .tag02 span img {
    display: block;
    text-align: center;
    margin: auto;
    position: absolute;
    top: -20px;
    bottom: 0;
    right: -80px;
    left: -100px;
    -webkit-transform: rotate(-45deg);
    transform: rotate(-45deg);
}
/* btn */
.activityBox .btn {
	position: absolute;
	bottom: 0;
	left: 0;
	text-align: center;
	width: 100%;
}


/* =================================== */


@media (max-width:420px) {

#MainContents .hotel01 img,
#MainContents .activityBox img { width:100%; }


/*----------------*/


/* hotel ==== */
#MainContents .hotel {
    padding:50px 20px;
}
#MainContents .hotel section {
    width: 84%;
    padding:8%;
    margin: 30px 0 0;
}

/* hotel01 */
.hotel01 .l,
.hotel01 .r { width:100%; }

/* hotel_info */
.hotel_info h1 { margin:10px 0 16px; float:none; }
.hotel_info .prt_btn01 { margin:20px 0 0; float:none; position:static;}
.hotel_info .clear li strong { float:none; display:block; text-align:left; }
.hotel_info .clear li:first-child { padding-top:0; border:0; }
.hotel_info .clear li:last-child  { padding-bottom:0; }


/* activity ==== */
/* wrap */
#MainContents .activity {
    width: 84%;
    padding:8%;
    padding:50px 0;
}
#MainContents .activityBox {
    padding: 0;
}
/* box */
.activityBox .in {
    width:100%;
    margin: 0 0 50px 0;
    float: none;
    height: auto !important;
}
/* tag */
#MainContents .activityBox .tag span img { width:75%; }
/* btn */
.activityBox .btn p { text-align:center; }


}