@charset "utf-8";

#container,
#container *,
#container *::before,
#container *::after {
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	word-break: normal;
	word-wrap: break-word;
	-webkit-text-size-adjust: 100%
}
img {
	max-width: 100%;
	vertical-align: bottom;
}
.pc-box {display: block;}
.sp-box {display: none;}
.br-pc { display:block; }
.br-sp { display:none; }
.br-tablet { display:none; }

.midashiMin{
	font-family: a-otf-midashi-mi-ma31-pr6n, serif;
	font-size: 16px;
}
.midashiGo{
	font-family: a-otf-midashi-go-mb31-pr6n, sans-serif;
	font-size: 16px;
}
.txt-align_left {
	text-align: left;
}
.txt-align_right {
	text-align: right;
}
.txt-align_center {
	text-align: center;
}
#container{
	position: relative;
}
#wrapper{
	padding-top: 103px;
	min-width: 100%;
	overflow: hidden;
}
#container{
	background-size: 18%;
}
section{
	width: 100%;
}
.sec_title{
	text-align: center;
	margin-bottom: 10px;
	line-height: 1.4;
}
.red{
	color: #cf000e !important;
}
.underline{
	text-decoration: underline;
}

a.link-btn {
	padding: 5px 20px;
	border: 1px solid #231815;
	color: #231815;
}

a.link-btn-m {
	width: auto;
	padding: 20px;
	border: 1px solid #231815;
	color: #231815;
}

/*パンくず*/
.harunorito .breadcrumb {
	position: relative;
	width: 100%;
	margin: 5px auto 1em;
	max-width: 1026px;
	font-size: 12px;
	color: #b7b7b7;
}
.harunorito .breadcrumb a {
	color: #000;
}
.harunorito__mv {
	position: relative;
	padding-top: 50.87%;
	background-image: url("../img/harunorito/mv-harunorito.jpg");
	background-position: center top;
	background-size: cover;
	background-repeat: no-repeat;
}
.harunorito__mv__inner{
	position: absolute;
	width: 80%;
	top: 50%;
	left: 50%;
	transform: translateY(-50%) translateX(-50%);
	margin: 0 auto;
	padding: 0;
}
.main__parts {
	position: relative;
	max-width: 100%;
	min-width: 75%;
}
.main__parts:before {
	position: absolute;
	display: inline-block;
	top: -25%;
	left: 0;
	width: 110px;
	height: 88px;
	content: '';
	background-image: url("../img/harunorito/logo-be-okinawa.png");
	background-size: contain;
	background-repeat: no-repeat;
}
.main__beokinawa {
	position: absolute;
	top: -50%;
	left: 4%;
}
.main__twitter {
	position: absolute;
	top: -25%;
	right: 0;
}
.main__twitter img {
	width: 50%;
}
.main__badge {
	position: absolute;
	top: -150px;
	right: 0;
	margin: 0;
	text-align: right;
}
.main__badge img {
	width: 50%;
}
.main__ttl img {
	width: 50%;
}
.harunorito__sec1 {
	margin: 0 auto 50px;
	padding-top: 100px;
	font-weight: 700;
}
.harunorito__sec1--lower {
	margin: 0 auto 50px;
	font-weight: 700;
}
.harunorito__sec1 .inner,
.harunorito__sec1--lower .inner {
	position: relative;
	width: 100%;
	max-width: 1024px;
	margin: 0 auto;
	padding: 0 15px;
	color: #333;
}
.harunorito__direct__wrap {
	height: 440px;
	margin-top: 0;
	background-image: url("../img/harunorito/harunorito-direct.jpg");
	background-position: right top;
	background-size: 50%;
	background-repeat: no-repeat;
}
.harunorito__luxuryresort__wrap {
	height: 440px;
	margin-top: 50px;
	background-image: url("../img/harunorito/harunorito-luxuryresort.jpg");
	background-position: left top;
	background-size: 50%;
	background-repeat: no-repeat;
}
.harunorito__workation__wrap {
	height: 440px;
	margin-top: 50px;
	background-image: url("../img/harunorito/harunorito-workation.jpg");
	background-position: right top;
	background-size: 50%;
	background-repeat: no-repeat;
}
.harunorito__camp__wrap {
	height: 440px;
	margin-top: 50px;
	background-image: url("../img/harunorito/harunorito-camp.jpg");
	background-position: left top;
	background-size: 50%;
	background-repeat: no-repeat;
}
.harunorito__direct,
.harunorito__luxuryresort,
.harunorito__workation,
.harunorito__camp {
	position: relative;
	width: 56%;
	font-size: 18px;
	line-height: 2;
	letter-spacing: .2rem;
}
.harunorito__direct,
.harunorito__workation {
	margin: 0 auto 0 0;
	text-align: left;
}
.harunorito__luxuryresort,
.harunorito__camp {
	margin: 0 0 0 auto;
	text-align: right;
}
.harunorito__sec1__ttl {
	font-size: 36px;
	line-height: 1.5;
}
.harunorito__ttl__catch {
	display: inline-block;
	margin-top: -4px;
	padding-left: 30px;
	color: #5268a9;
	font-size: 21px;
}
.harunorito__ttl__catch:before,
.harunorito__ttl__catch:after {
	content: '';
	position: absolute;
	top: 8%;
	display: inline-block;
	width: 26px;
	height: 2px;
	background-color: #5268a9;
}
.harunorito__ttl__catch:before {
	margin-left: -30px;
	-webkit-transform: rotate(60deg);
	transform: rotate(60deg);
}
.harunorito__ttl__catch:after {
	-webkit-transform: rotate(-60deg);
	transform: rotate(-60deg);
}
.harunorito__sec1__txt {
	margin: 20px 0;
}
.twitter-campaign-wrap {
	position: relative;
	margin: 0 auto;
	padding-top: calc( (774/1440) * 100 );
	padding-bottom: 15px;
	background-image: url("../img/harunorito/bg-twitter-campaign.jpg");
	background-position: center top;
	background-size: cover;
	background-repeat: no-repeat;
}
.twitter-campaign-wrap img {
	width: 90%;
	margin-top: 25px;
}
.twitter-campaign-step-wrap {
	width: 85%;
	margin: 0 auto 30px;
}
.twitter-campaign-step-inner {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	margin-top: 20px;
}
.twitter-capmpaign-step-box {
	width: 30%;
	background-color: rgba(256, 256, 256, .8);
}
.twitter-capmpaign-step-head {
	padding: 8px;
	background-color: #f4e829;
}
.twitter-campaign-step-contents {
	padding: 12px;
}
.twitter-campaign-rule {
	color: #fff;
}
.twitter-campaign-rule a:link,
.twitter-campaign-rule a:visited {
	color: #fff;
	text-decoration: underline;
}
.twitter-campaign-rule a:hover {
	color: #fff;
	text-decoration: none;
}
.winning-announcement {
	padding-top: 3%;
	background-color: #f4e829;
}
.harunorito-plan-wrap {
	margin-top: 80px;
}
.harunorito-plan-head {
	margin-bottom: 20px;
	font-size: 24px;
}
.harunorito-plan-inner {
	display: flex;
	flex-wrap: wrap;
	justify-content: flex-start;
}
.harunorito-plan-box {
	width: 24%;
	margin-bottom: 20px;
	margin-right: 13px;
}
.harunorito-plan-box:nth-child(4n) {
	margin-right: 0;
}
.harunorito-plan-img {}
.harunorito-plan-txt {
	padding: 5px;
	line-height: 1.6;
	text-align: left;
}
.rito-post-wrap {
	margin-top: 80px;
}
.rito-post-inner {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
}
.rito-post-box {
	width: 24%;
	margin-right: 13px;
}
.rito-post-box:nth-child(4n) {
	margin-right: 0;
}
.rito-post-img {
	position: relative;
}
.rito-post-txt {
	padding: 5px;
	line-height: 1.6;
	text-align: left;
}
.rito-cat-yaeyama {
	color: #ff77a4;
}
.rito-cat-kumejima {
	color: #ff8600;
}
.rito-cat-miyako {
	color: #61a2e2;
}
.rito-cat-15islands {
	color: #745798;
}
.harunorito-lower-head-l {
	position: relative;
	font-size: 36px;
	line-height: 1.6;
}
.harunorito-lower-head-m {
	margin: 40px 0;
	font-size: 28px;
	line-height: 1.6;
}
.harunorito-lower-head-s {}
.harunorito-lower-txt {
	margin: 40px 0;
	line-height: 2;
}
.harunorito-direct-wrap {
	margin-top: 60px;
}
.harunorito-workation-wrap {
	margin-top: 100px;
}
.harunorito-workation-wrap:first-child {
	margin-top: 60px;
}
.harunorito-direct-inner {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
}
.harunorito-direct-inner.direct-airline {
	flex-wrap: nowrap;
	margin-top: 40px;
}
.harunorito-img-box {
	width: 50%;
}
.harunorito-img-box.img-direct-koro {
	width: calc( 50% - 20px / 2 );
	margin: 0 20px 20px 0;
}
.harunorito-img-box.img-direct-koro:nth-child(2n+2) {
	margin-right: 0;
}
.harunorito-footer-nav-wrap {
	width: 86%;
	margin: 80px auto 0;
}
.harunorito-footer-nav-inner {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-around;
}
.harunorito-footer-nav-box {
	margin-top: 15px;
}
.head-deco-1day,
.head-deco-premium,
.head-deco-luxury,
.head-deco-healing,
.head-deco-yaeyama,
.head-deco-miyako,
.head-deco-kumejima {
	position: relative;
}
.head-deco-1day:before,
.head-deco-premium:before,
.head-deco-luxury:before,
.head-deco-healing:before,
.head-deco-yaeyama:before,
.head-deco-miyako:before,
.head-deco-kumejima:before {
	position: absolute;
	display: inline-block;
	top: 5%;
	left: -3%;
	width: 100%;
	height: 100%;
	content: '';
	background-size: contain;
	background-repeat: no-repeat;
}
.head-deco-1day:before {
	background-image: url("../img/harunorito/img-plus-one-day.png");
}
.head-deco-premium:before {
	background-image: url("../img/harunorito/img-premium.png");
}
.head-deco-luxury:before {
	background-image: url("../img/harunorito/img-luxury.png");
}
.head-deco-healing:before {
	background-image: url("../img/harunorito/img-healing.png");
}
.head-deco-yaeyama:before {
	background-image: url("../img/harunorito/img-yaeyama.png");
}
.head-deco-miyako:before {
	background-image: url("../img/harunorito/img-miyako.png");
}
.head-deco-kumejima:before {
	background-image: url("../img/harunorito/img-kumejima.png");
}
.harunorito-workation-support {
	padding: 30px;
	background-color: #f5f3ee;
}
.harunorito-workation-support-head {
	font-size: 24px;
}
.harunorito-workation-support-txt {
	margin-top: 25px;
	line-height: 1.8;
}
#reservation {
	margin-top: -60px;
	padding-top: 140px;
}
#twitter-campaign {
	margin: -60px auto 20px;
	padding-top: 140px;
}
.project {
	display: flex;
	flex-flow: row wrap;
	justify-content: space-between;
	width: 100%;
	margin-top: 80px;
}
.project .project__img {
	width: 25%;
	max-width: 268px;
}
.project .project__txt {
	width: 65%;
	max-width: 680px;
	margin-left: 56px;
	font-size: 16px;
	text-align: left;
	line-height: 2;
}
.attention-txt_image {
	margin-top: 50px;
}
.attention-harunorito {
	width: 60%;
	margin: 0 0 0 auto;
	padding: 12px;
	border: 2px solid #d13d4f;
	color: #d13d4f;
	text-align: center;
}

@media (max-width: 768px) {
	.pc-box { display: none; }
	.sp-box { display: block; }
	.br-sp { display: inline-block; }
	.br-pc { display:none; }
	
	a.link-btn,
	a.link-btn-m {
		display: block;
		width: 75%;
		margin-right: auto;
		margin-left: auto;
		text-align: center;
	}
	#wrapper {
		margin: 0;
		padding-top: 64px;
	}
	.harunorito .breadcrumb {
		margin: 0;
		padding: 2%;
		background-color: #f4f4f4;
	}
	.harunorito__sec1 {
		padding-top: 60px;
	}
	.harunorito__sec1--lower {
		margin-bottom: 20px;
	}
	.harunorito__sec1 .inner {
		padding: 0 3.6%;
	}
	.harunorito__mv {
		background-image: url("../img/harunorito/mv-harunorito.jpg");
	}
	.main__parts:before {
		top: -15%;
		left: -6%;
		width: 50%;
		height: 50%;
	}
	.main__twitter {
		top: -15%;
		right: -6%;
		width: 12%;
		text-align: right;
	}
	.main__twitter img {
		width: 100%;
	}
	.main__ttl img {
		width: 60%;
	}
	.main__badge {
		top: -2.5%;
		right: 3%;
		width: 25%;
	}
	.main__badge img {
		width: 100%;
	}
	.harunorito-lower-head-l {
		font-size: 22px;
	}
	.harunorito-plan-head {
		line-height: 1.6;
	}
	.harunorito__direct__wrap,
	.harunorito__luxuryresort__wrap,
	.harunorito__workation__wrap,
	.harunorito__camp__wrap {
		height: auto;
		background-image: none;
	}
	.harunorito__direct,
	.harunorito__luxuryresort,
	.harunorito__workation,
	.harunorito__camp {
		width: 100%;
		margin: 0;
		text-align: left;
	}
	.harunorito__sec1__ttl {
		margin-bottom: 10px;
		font-size: 20px;
	}
	.harunorito__ttl__catch {
		font-size: 16px;
	}
	.harunorito__ttl__catch:before,
	.harunorito__ttl__catch:after {
		top: 3%;
	}
	.harunorito__sec1__txt {
		font-size: 15px;
		line-height: 1.8;
	}
	.harunorito-workation-wrap {
		margin-top: 40px;
	}
	.head-deco-1day,
	.head-deco-premium,
	.head-deco-luxury,
	.head-deco-healing,
	.head-deco-yaeyama,
	.head-deco-miyako,
	.head-deco-kumejima {
		padding-top: 90px;
	}
	.head-deco-1day:before,
	.head-deco-premium:before,
	.head-deco-luxury:before,
	.head-deco-healing:before,
	.head-deco-yaeyama:before,
	.head-deco-miyako:before,
	.head-deco-kumejima:before {
		display: block;
		top: 50%;
		left: 50%;
		transform: translateY(-50%) translateX(-50%);
		width: 50%;
		margin-top: 0;
	}
	.harunorito-lower-head-m {
		margin: 20px 0;
		font-size: 24px;
	}
	.harunorito-lower-txt {
		margin: 20px 0;
		line-height: 1.7;
	}
	.harunorito-img-box.img-direct-koro,
	.harunorito-img-box.img-naha-kumejima,
	.harunorito-img-box.img-naha-shimoji {
		width: 100%;
		margin: 15px 0 0 0;
	}
	.harunorito-img-box.img-naha-kumejima {
		margin: 0;
	}
	.harunorito-img-box.img-naha-shimoji {
		margin-top: 40px;
	}
	.twitter-campaign-step-wrap {}
	.twitter-campaign-step-inner {
		display: block;
	}
	.twitter-capmpaign-step-box {
		width: 100%;
		margin-top: 15px;
	}
	.twitter-capmpaign-step-box:first-child {
		margin-top: 0;
	}
	.harunorito-plan-wrap {
		margin-top: 40px;
	}
	.harunorito-plan-inner {}
	.harunorito-plan-box {
		width: calc( 50% - 10px / 2 );
		margin: 0 10px 20px 0;
	}
	.harunorito-plan-box:nth-child(2n+2) {
		margin-right: 0;
	}
	.harunorito-plan-txt {
		font-size: 13px;
	}
	.rito-post-wrap {
		margin-top: 40px;
	}
	.rito-post-box {
		width: calc( 50% - 10px / 2 );
		margin: 0 10px 20px 0;
	}
	.rito-post-box:nth-child(2n+2) {
		margin-right: 0;
	}
	.rito-post-txt {
		padding: 0;
	}
	.rito-post-txt,
	.rito-txt {
		font-size: 13px;
	}
	.harunorito-direct-inner.direct-airline {
		flex-wrap: wrap;
		margin-top: 20px;
	}
	.direct-airline .harunorito-img-box {
		width: calc( 50% - 10px / 2 );
		margin: 0 10px 15px 0;
	}
	.harunorito-footer-nav-wrap {
		width: 100%;
		margin: 0 auto 0;
	}
	.direct-airline .harunorito-img-box:nth-child(2n+2) {
		margin-right: 0;
	}
	.attention-harunorito {
		width: 75%;
		margin: 0 auto;
	}
	.project {
		display: block;
		margin-top: 40px;
	}
	.project .project__img {
		width: 100%;
		max-width: 100%;
		margin: 0 auto 30px;
	}
	.project .project__txt {
		width: 100%;
		margin: 0 auto ;
	}
}
