@charset "UTF-8";

/* ===================================================================
Search
=================================================================== */

/* 外側 サーチボタン
--------------------*/

.search-main-btn {
	position: relative;
    display: block;
	width: 500px;
	height: 79.7px;
    margin: 50px auto;
    padding: 0;
    font-size: 28px;
    font-weight: bold;
    color: #fff;
	text-align: center;
	line-height: 79.7px;
	border-radius: 50px;
    background: url(/ski/images/search/search_btn.png) 50% 50% / contain no-repeat, transparent;
    letter-spacing: 3px;
    cursor: pointer;
}

.search-main-btn:before {
    content: '';
    position: absolute;
    top: 50%;
    transform: translate(0, -50%);
	left: 20px;
    width: 39.7px;
    height: 39.7px;
    background: url(/ski/images/search/search_home_btn_icon.png) 50% 50% / contain no-repeat, transparent;
}

.search-main-btn:hover {
	color: #e50012;
    background: url(/ski/images/search/search_btn_over.png) 50% 50% / contain no-repeat, transparent;
}

.search-main-btn:hover:before {
	background: url(/ski/images/search/search_home_btn_icon_over.png) 50% 50% / contain no-repeat, transparent;
}

/* 側
--------------------*/

#iziModal_search {
	display: none;
	position: fixed;
	top: 0;
	left: 0;
	width: 100vw;
	height: 100vh;
	background: rgba(0, 0, 0, .25);
	overflow-y: auto;
	z-index: 1000;
}

#iziModal_search .search {
	position: absolute;
	left: 50%;
	transform: translate(-50%, 0);
	background: #fff;
	width: 1040px;
	margin: 0 auto 30px;
	border-radius: 10px;
	box-shadow: 0px 5px 10px rgb(0, 0, 0, .5);
	z-index: 1000;
}

#iziModal_search .search .search-container {
    position: relative;
    width: 100%;
    max-width: 1040px;
    margin: 0 auto;
    padding: 0 20px;
}

/* 側 可視
--------------------*/

#iziModal_search.open {
	display: block;
}

/* ローディング
--------------------*/

.search-loading {
    position: relative;
    width: 300px;
    height: 300px;
    margin: 130.5px auto;
    text-align: center;
}

/* レイアウト
--------------------*/

.common-search {
	display: none;
    padding: 85px 0 50px;
}

/* 閉じるボタン
--------------------*/

.search-close-btn {
	display: none;
	position: absolute;
    top: 10px;
    right: 10px;
	padding: 0 0 0 30px;
	color: #c5c5c5;
}

.search-close-btn:after {
    content: '';
    position: absolute;
    top: 50%;
    transform: translate(0, -50%);
    left: 0;
    width: 20px;
    height: 20px;
    background: url(/ski/images/search/search_close_icon.png) 50% 50% / contain no-repeat, transparent;
}

.search-close-btn:hover {
	color: #000;
}

.search-close-btn:hover:after {
	background: url(/ski/images/search/search_close_icon_over.png) 50% 50% / contain no-repeat, transparent;
}

/* パーツスタイル 検索フォーム
--------------------*/

.common-search input {
	display: none;
}

.common-search label {
	display: flex;
	justify-content: center;
	align-items: center;
	width: 100%;
	height: 60px;
	padding: 0 10px;
	color: #e50012;
	font-size: 15px;
	text-align: center;
	line-height: 1.2;
	background: transparent;
	border: 1px solid #e50012;
	border-radius: 10px;
	transition: all .3s ease-out 0s;
}

.common-search select {
	display: block;
	width: 100%;
	height: 40px;
	padding: 0 15px;
    font-size: 15px;
	color: #e50012;
	background: transparent;
	border: 1px solid #e50012;
	border-radius: 20px;
	overflow: hidden;
	transition: all .3s ease-out 0s;
}

.common-search select:disabled,
.common-search input:disabled + label,
.common-search button:disabled {
	color: #bbbbbb;
	border: 1px solid #bbbbbb;
    cursor: default;
}

.common-search input::placeholder,
.common-search input:-ms-input-placeholder,
.common-search input::-ms-input-placeholder {
	color: #000;
}

.common-search input:disabled::placeholder,
.common-search input:disabled:-ms-input-placeholder,
.common-search input:disabled::-ms-input-placeholder {
	color: #bbbbbb;
}

.common-search input:hover,
.common-search select:hover,
.common-search label:hover {
	color: #e50012;
	border: 1px solid #e50012;
}

.common-search input:disabled:hover,
.common-search select:disabled:hover,
.common-search input[type=radio]:disabled + label:hover {
	color: #bbbbbb;
	border: 1px solid #bbbbbb;
}

/* パーツスタイル キーワード検索
--------------------*/

.keyword-input input {
	display: block;
	width: 100%;
	height: 40px;
	padding: 0 15px;
    font-size: 15px;
	color: #000;
	background: transparent;
	border: 1px solid #000;
	border-radius: 20px;
	overflow: hidden;
	transition: all .3s ease-out 0s;
}

/* 内部レイアウト
--------------------*/

.search-inner {
	display: flex;
	justify-content: space-between;
	align-items: flex-start;
}

/* 各フォーム レイアウト
--------------------*/

.search-inner dl { /* 全体 490px */
	display: flex;
	justify-content: space-between;
	align-items: center;
	width: 49%;
	margin: 0 0 30px;
}

/* 各フォーム タイトル
--------------------*/

.search-inner dl dt { /* タイトル 120px */
	position: relative;
	width: 113px;
	height: 50px;
	margin: 0 7px 0 0;
}

.search-inner dl dt:before {
	content: '';
	position: absolute;
	top: 50%;
	transform: translate(0, -50%);
	left: 0;
	width: 100%;
	height: 100%;
}

.search-inner dl.tf-inner dt:before {
    background: url(/ski/images/search/form_icon_tf.png) 50% 0% / contain no-repeat, transparent;
}

.search-inner dl.d2-inner dt:before {
	background: url(/ski/images/search/form_icon_d2.png) 50% 50% / contain no-repeat, transparent;
}

.search-inner dl.ym-dd-inner dt:before {
	background: url(/ski/images/search/form_icon_ym_dd.png) 50% 50% / contain no-repeat, transparent;
}

.search-inner dl.traffic-inner dt:before {
	background: url(/ski/images/search/form_icon_traffic.png) 50% 50% / contain no-repeat, transparent;
}

.search-inner dl.h3-inner dt:before {
	background: url(/ski/images/search/form_icon_h3.png) 50% 50% / contain no-repeat, transparent;
}

.search-inner dl.ma-mi-inner dt:before {
	background: url(/ski/images/search/form_icon_ma_mi.png) 50% 50% / contain no-repeat, transparent;
}

/* 各フォーム セレクトボックス
--------------------*/

.search-inner dl dd.select {
	position: relative;
}

.search-inner dl dd.select:after {
	content: '';
	position: absolute;
	top: 50%;
	transform: translate(0, -50%);
	right: 10px;
	width: 15px;
	height: 13px;
	background: url(/ski/images/search/form_select_icon.png) 50% 50% / contain no-repeat, transparent;
	pointer-events: none;
}

.search-inner dl dd.select.active:after {
	background: url(/ski/images/search/form_select_icon_active.png) 50% 50% / contain no-repeat, transparent;
}

/* 各フォーム プラン
--------------------*/

.search-inner dl.tf-inner dd:nth-of-type(1),
.search-inner dl.tf-inner dd:nth-of-type(2),
.search-inner dl.tf-inner dd:nth-of-type(3) {
	width: 88.75px;
	margin: 0 5px 0 0;
}

.search-inner dl.tf-inner dd:nth-of-type(4) {
	width: 88.75px;
	margin: 0;
}

.search-inner dl.tf-inner dd input:checked + label {
	color: #fff;
	background: #e50012;
	border: 1px solid #e50012;
}

/* 各フォーム 交通
--------------------*/

.common-search .search-inner dl.traffic-inner label {
	padding: 0 5px;
    font-size: 14px;
}

.search-inner dl.traffic-inner dd:nth-of-type(1),
.search-inner dl.traffic-inner dd:nth-of-type(2),
.search-inner dl.traffic-inner dd:nth-of-type(3) {
	width: 88.75px;
	margin: 0 5px 0 0;
}

.search-inner dl.traffic-inner dd:nth-of-type(4) {
	width: 88.75px;
	margin: 0;
}

.search-inner dl.traffic-inner dd input:checked + label {
	color: #fff;
	background: #e50012;
	border: 1px solid #e50012;
}

/* 各フォーム 出発地
--------------------*/

.search-inner dl.d2-inner dd {
	width: 370px;
}

/* 各フォーム 出発日
--------------------*/

.search-inner dl.ym-dd-inner dd:nth-of-type(1) {
	width: 135px;
	margin: 0 5px 0 0;
}

.search-inner dl.ym-dd-inner dd:nth-of-type(2) {
	width: 85px;
	margin: 0 5px 0 0;
}

.search-inner dl.ym-dd-inner dd:nth-of-type(3) {
	width: 140px;
}

.search-inner dl.ym-dd-inner dd:nth-of-type(3) button { /* カレンダー */
    position: relative;
	display: flex;
	align-items: center;
    width: 100%;
    height: 40px;
    padding: 0 15px 0 60px;
    font-size: 12px;
	color: #e50012;
	text-align: left;
    background: transparent;
    border: 1px solid #e50012;
    border-radius: 20px;
	overflow: hidden;
	transition: all .3s ease-out 0s;
}

.search-inner dl.ym-dd-inner dd:nth-of-type(3) button:after {
	content: '';
	position: absolute;
	top: 50%;
	transform: translate(0, -50%);
    left: 20px;
	width: 24px;
	height: 36px;
	background: url(/ski/images/search/calendar_over.png) 50% 50% / contain no-repeat, transparent;
}

.search-inner dl.ym-dd-inner dd:nth-of-type(3) button:disabled {
	color: #bbbbbb;
	border: 1px solid #bbbbbb;
}

.search-inner dl.ym-dd-inner dd:nth-of-type(3) button:disabled:after {
	background: url(/ski/images/search/calendar.png) 50% 50% / contain no-repeat, transparent;
}

.search-inner dl.ym-dd-inner dd:nth-of-type(3) button:hover {
	color: #e50012;
	border: 1px solid #e50012;
}

.search-inner dl.ym-dd-inner dd:nth-of-type(3) button:hover:after {
	background: url(/ski/images/search/calendar_over.png) 50% 50% / contain no-repeat, transparent;
}

.search-inner dl.ym-dd-inner dd:nth-of-type(3) button:disabled:hover {
	color: #bbbbbb;
	border: 1px solid #bbbbbb;
}

.search-inner dl.ym-dd-inner dd:nth-of-type(3) button:disabled:hover:after {
	background: url(/ski/images/search/calendar.png) 50% 50% / contain no-repeat, transparent;
}

/* 各フォーム 行先
--------------------*/

.search-inner dl.h3-inner dd {
	width: 370px;
}

/* 各フォーム 価格帯
--------------------*/

.search-inner dl.ma-mi-inner dd:nth-of-type(1),
.search-inner dl.ma-mi-inner dd:nth-of-type(3) {
	width: 165px;
}

.search-inner dl.ma-mi-inner dd:nth-of-type(2) {
	width: 40px;
	font-size: 20px;
	text-align: center;
}

/* search content submit
--------------------*/

.common-search .submit {
	display: block;
	width: 200px;
	margin: 20px auto 0;
}

.common-search .submit button {
	position: relative;
    display: block;
    width: 100%;
    padding: 10px 0px 10px 35px;
    font-size: 18px;
	color: #fff;
	text-align: center;
	border: 2px solid #c5c5c5;
    border-radius: 10px;
    background: #c5c5c5;
	letter-spacing: 3px;
	transition: all .3s ease-out 0s;
}

.common-search .submit button:before {
	content: '';
	position: absolute;
	top: 50%;
	transform: translate(0, -50%);
	left: 15px;
	width: 28px;
	height: 26px;
	background: url(/ski/images/search/search_btn_icon.png) 50% 50% / contain no-repeat, transparent;
}

.common-search .submit button:not(:disabled) {
	border: 2px solid #e50012;
	background: #e50012;
}

.common-search .submit button:not(:disabled):hover {
	color: #e50012;
	background: #fff;
}

.common-search .submit button:not(:disabled):hover:before {
	background: url(/ski/images/search/search_btn_icon_over.png) 50% 50% / contain no-repeat, transparent;
}

/* keyword
--------------------*/

.keyword {
	padding: 60px 0;
	background: #ededed;
}

.keyword-area {
	display: flex;
	justify-content: center;
	align-items: center;
}

.keyword-input {
	position: relative;
	padding: 0 0 0 40px;
	margin: 0 20px 0 0;
}

.keyword-input:before {
	content: '';
	position: absolute;
	top: 50%;
	transform: translate(0, -50%);
	left: 0;
	width: 28px;
	height: 26px;
	background: url(/ski/images/search/search_keyword_icon.png) 50% 50% / contain no-repeat, transparent;
}

.keyword-area input {
	width: 480px;
	border: 1px solid #c5c5c5;
	background: #fff;
}

.keyword-area input::placeholder {
	color: #c5c5c5;
}

.keyword-area input:-ms-input-placeholder {
	color: #c5c5c5;
}

.keyword-area input::-ms-input-placeholder {
	color: #c5c5c5;
}

.keyword-form-submit {
	position: relative;
	display: block;
	width: 135px;
}

.keyword-form-submit button {
    display: block;
    width: 100%;
    padding: 4px 0;
    font-size: 17px;
	color: #fff;
	border: 2px solid #c5c5c5;
    border-radius: 10px;
    background: #c5c5c5;
	letter-spacing: 3px;
	transition: all .3s ease-out 0s;
}

.keyword-form-submit button:not(:disabled) {
	border: 2px solid #e50012;
	background: #e50012;
}

.keyword-form-submit button:not(:disabled):hover {
	color: #e50012;
	background: #fff;
}

/* keyword tag
--------------------*/

.tag-area {
	margin: 25px 0 0;
}

.tag-area ul {
	display: flex;
	justify-content: center;
	align-items: center;
	flex-wrap: wrap;
}

.tag-area ul li {
	display: block;
	margin: 0 10px 10px;
	padding: 4px 15px;
	color: #4496ec;
	font-size: 17px;
	font-weight: bold;
	text-align: center;
	background: #fff;
	border: 1px solid #4496ec;
	border-radius: 20px;
	cursor: pointer;
	transition: all .3s ease-out 0s;
}

.tag-area ul li:hover {
	color: #fff;
	background: #4496ec;
}

/* check box
--------------------*/

.common-search .ch {
	margin: 20px auto 50px;
}

.common-search .ch .ch-open {
	display: block;
	position: relative;
	width: 305px;
	height: 55px;
	margin: 0 auto;
	padding: 12px 15px 12px 70px;
	color: #e50012;
	font-size: 21px;
	font-weight: bold;
	text-align: left;
    line-height: 1.6;
	background: #fff;
	border: 1px solid #e50012;
	border-radius: 12px;
	transition: all .3s ease-out 0s;
}

.common-search .ch .ch-open::before {
	content: "";
	position: absolute;
	top: 50%;
	left: 29px;
	transform: translate(0, -50%);
	width: 6px;
	height: 20px;
	transition: .5s;
	background: #e50012;
	border-radius: 3px;
	transition: all .3s ease-out 0s;
}

.common-search .ch .ch-open::after {
	content: "";
	position: absolute;
	top: 50%;
	left: 22px;
	transform: translate(0, -50%);
	width: 20px;
	height: 6px;
	background: #e50012;
	border-radius: 3px;
	transition: all .3s ease-out 0s;
}

.common-search .ch .ch-open:hover {
	background: #e50012;
	color: #fff;
}

.common-search .ch .ch-open:hover::before,
.common-search .ch .ch-open:hover::after {
	background: #fff;
}

.common-search .ch .ch-inner {
	display: none;
	background: #fff;
	border-top: 2px solid #c5c5c5;
	border-bottom: 2px solid #c5c5c5;
}

.common-search .ch .ch-inner label {
	display: block;
	width: auto;
	height: auto;
	padding: 0 0 0 35px;
	color: #808080;
	text-align: left;
	background: transparent;
	border: none;
	transition: all .3s ease-out 0s;
}

.common-search .ch #ch_open:checked + .ch-open + .ch-inner {
	display: block;
	margin: 50px 0;
	padding: 50px 65px;
}

.common-search .ch #ch_open:checked + .ch-open::before {
	display: none;
}

.common-search .ch .ch-inner .ch-content {
	display: flex;
	justify-content: flex-start;
	flex-wrap: wrap;
	align-items: center;
}

.common-search .ch .ch-inner .ch-content p {
	width: 33.33333%;
	margin: 10px 0;
}

.common-search .ch .ch-inner .ch-content .checkbox {
	position: relative;
	padding: 0 20px 0 30px;
}

.common-search .ch .ch-inner .ch-content .checkbox::after,
.common-search .ch .ch-inner .ch-content .checkbox::before {
	content: '';
	position: absolute;
	display: block;
}

.common-search .ch .ch-inner .ch-content .checkbox::before {
	top: 50%;
	transform: translate(0, -50%);
	left: 0;
	width: 15px;
	height: 15px;
	border: 2px solid #c8c8c8;
}

.common-search .ch .ch-inner .ch-content input[type=checkbox]:checked + .checkbox::after {
	top: calc( 50% - 7.5px );
	transform: translate(0, -50%);
    left: 6px;
    width: 5px;
    height: 10px;
    border-right: 2px solid #e50012;
    border-bottom: 2px solid #e50012;
    transform: rotate(45deg);
}

/* フォーム カレンダー本体
--------------------*/

.datepicker-container {
	width: 258px ;
    padding: 10px;
	font-weight: bold;
}

.datepicker-container.datepicker-top-left, 
.datepicker-container.datepicker-top-right {
	border-top-color: #e50012;
}

.datepicker-container.datepicker-bottom-left,
.datepicker-container.datepicker-bottom-right {
    border-bottom-color: #e50012;
}

.datepicker-container.datepicker-top-left:before,
.datepicker-container.datepicker-top-right:before {
    border-bottom-color: #e50012;
}

.datepicker-container.datepicker-bottom-left:before,
.datepicker-container.datepicker-bottom-right:before {
    border-top-color: #e50012;
}

.datepicker-container .datepicker-panel > ul {
	display: flex;
	justify-content: space-between;
	align-items: flex-start;
	flex-wrap: wrap;
	width: 100%;
	margin: 0 0 3px;
    padding: 0 0 3px;
	border-bottom: 1px solid #e50012;
}

.datepicker-container .datepicker-panel > ul > li {
    float: none;
    width: 30px;
    height: 30px;
    margin: 2px;
    font-size: 14px;
}

.datepicker-container .datepicker-panel > ul > li[data-view="month current"],
.datepicker-container .datepicker-panel > ul > li[data-view="year current"],
.datepicker-container .datepicker-panel > ul > li[data-view="years current"] {
    width: 150px;
}

.datepicker-container .datepicker-panel > ul > li.picked,
.datepicker-container .datepicker-panel > ul > li.picked:hover {
    color: #e50012;
}

.datepicker-container .datepicker-panel > ul > li:hover {
	background-color: rgba(229, 0, 18, .15);
}

.datepicker-container .datepicker-panel > ul > li.muted,
.datepicker-container .datepicker-panel > ul > li.muted:hover {
    color: #c5c5c5;
}

.datepicker-container .datepicker-panel > ul > li.disabled,
.datepicker-container .datepicker-panel > ul > li.disabled:hover {
    color: #ededed;
}

.datepicker-container .datepicker-panel > ul > li.highlighted,
.datepicker-container .datepicker-panel > ul > li.disabled.highlighted,
.datepicker-container .datepicker-panel > ul > li.disabled:hover.highlighted {
	background-color: rgba(229, 0, 18, .15);
}

@media screen and (max-width: 1000px) {
	
	/* ===================================================================
	Form
	=================================================================== */

	/* 外側 サーチボタン
	--------------------*/

	.search-main-btn {
		width: 280px;
		height: 44.634px;
		margin: 25px auto;
		font-size: 17px;
		line-height: 44.634px;
		letter-spacing: 1px;
	}

	.search-main-btn:before {
		left: 10px;
		width: 24.634px;
		height: 24.634px;
	}

	/* 側
	--------------------*/

	#iziModal_search .search {
		width: 100%;
		max-width: 450px;
	}

	#iziModal_search .search .search-container {
		max-width: 630px;
		padding: 0 15px;
	}

	/* ローディング
	--------------------*/

	.search-loading {
		width: 200px;
		height: 200px;
		margin: 150px auto;
	}

	/* レイアウト
	--------------------*/

	.common-search {
		padding: 60px 0 30px;
	}

	/* パーツスタイル 検索フォーム
	--------------------*/

	.common-search input,
	.common-search select {
		height: 35px;
		padding: 0 10px;
		font-size: 12px;
		border-radius: 17.5px;
	}

	.keyword-input input {
		height: 35px;
		padding: 0 10px;
		font-size: 12px;
		border-radius: 17.5px;
	}

	.common-search label {
		height: 45px;
		padding: 0;
		font-size: 12px;
		border-radius: 5px;
	}

	/* 内部レイアウト
	--------------------*/

	.search-inner {
		display: block;
	}

	/* 各フォーム レイアウト
	--------------------*/

	.search-inner dl {
		width: 100%;
		margin: 0 0 20px;
	}

	/* 各フォーム タイトル
	--------------------*/

	.search-inner dl dt { /* タイトル */
		width: 21%;
		height: 35px;
		margin: 0 1% 0 0;
	}

	/* 各フォーム セレクトボックス
	--------------------*/

	.search-inner dl dd.select {
		position: relative;
	}

	.search-inner dl dd.select:after {
	    right: 8px;
		width: 7.5px;
		height: 6.5px;
	}

	/* 各フォーム プラン
	--------------------*/

	.search-inner dl.tf-inner dd:nth-of-type(1),
	.search-inner dl.tf-inner dd:nth-of-type(2),
	.search-inner dl.tf-inner dd:nth-of-type(3) {
		width: 18%;
		margin: 0 2% 0 0;
	}

	.search-inner dl.tf-inner dd:nth-of-type(4) {
		width: 18%;
		margin: 0;
	}

	/* 各フォーム 交通
	--------------------*/

	.common-search .search-inner dl.traffic-inner label {
		padding: 0;
		font-size: 12px;
	}

	.search-inner dl.traffic-inner dd:nth-of-type(1),
	.search-inner dl.traffic-inner dd:nth-of-type(2),
	.search-inner dl.traffic-inner dd:nth-of-type(3) {
		width: 18%;
		margin: 0 2% 0 0;
	}

	.search-inner dl.traffic-inner dd:nth-of-type(4) {
		width: 18%;
		margin: 0;
	}

	/* 各フォーム 出発地
	--------------------*/

	.search-inner dl.d2-inner dd {
		width: 78%;
	}

	/* 各フォーム 出発日
	--------------------*/

	.search-inner dl.ym-dd-inner dd:nth-of-type(1) {
		width: 30%;
		margin: 0 1% 0 0;
	}

	.search-inner dl.ym-dd-inner dd:nth-of-type(2) {
		width: 20%;
		margin: 0 1% 0 0;
	}

	.search-inner dl.ym-dd-inner dd:nth-of-type(3) {
		width: 26%;
	}

	.search-inner dl.ym-dd-inner dd:nth-of-type(3) button { /* カレンダー */
		height: 35px;
		padding: 0 5px 0 25px;
		font-size: 9px;
		line-height: 1.2;
		border-radius: 17.5px;
	}

	.search-inner dl.ym-dd-inner dd:nth-of-type(3) button:after {
		left: 6px;
		width: 12px;
		height: 18px;
	}

	/* 各フォーム 行先
	--------------------*/

	.search-inner dl.h3-inner dd {
		width: 78%;
	}

	/* 各フォーム 価格帯
	--------------------*/

	.search-inner dl.ma-mi-inner dd:nth-of-type(1),
	.search-inner dl.ma-mi-inner dd:nth-of-type(3) {
		width: 35%;
	}

	.search-inner dl.ma-mi-inner dd:nth-of-type(2) {
		width: 8%;
		font-size: 15px;
	}

	/* search content submit
	--------------------*/

	.common-search .submit {
		display: block;
		width: 160px;
		margin: 30px auto 0;
	}

	.common-search .submit button {
		padding: 5px 0px 5px 30px;
		font-size: 16px;
	}

	.common-search .submit button:before {
		left: 10px;
		width: 19px;
		height: 18px;
	}

	/* keyword
	--------------------*/

	.keyword {
		padding: 20px 0;
	}

	.keyword-area {
		display: flex;
		justify-content: center;
		align-items: center;
	}

	.keyword-input {
		position: relative;
		padding: 0 0 0 35px;
		margin: 0px 5px 0 0;
		width: calc(100% - 70px);
	}

	.keyword-input:before {
		content: '';
		position: absolute;
		top: 50%;
		transform: translate(0, -50%);
		left: 0;
		width: 32px;
		height: 30px;
		background: url(/ski/images/search/search_keyword_icon.png) 50% 50% / contain no-repeat, transparent;
	}

	.keyword-area input {
		width: 100%;
		font-size: 10px;
	}
	
	.keyword-input:before {
		width: 28px;
		height: 26px;
	}

	.keyword-area input::placeholder {
		color: #c5c5c5;
	}

	.keyword-area input:-ms-input-placeholder {
		color: #c5c5c5;
	}

	.keyword-area input::-ms-input-placeholder {
		color: #c5c5c5;
	}

	.keyword-form-submit {
		position: relative;
		display: block;
		width: 65px;
	}

	.keyword-form-submit button {
		display: block;
		width: 100%;
		padding: 5px 7px;
		font-size: 11px;
		color: #fff;
		border: 2px solid #c5c5c5;
		border-radius: 10px;
		background: #c5c5c5;
		letter-spacing: 0px;
		transition: all .3s ease-out 0s;
	}

	.keyword-form-submit button:not(:disabled) {
		border: 2px solid #e50012;
		background: #e50012;
	}

	.keyword-form-submit button:not(:disabled):hover {
		color: #e50012;
		background: #fff;
	}

	/* keyword tag
	--------------------*/

	.tag-area {
		margin: 15px 0 0;
	}

	.tag-area ul {
		display: flex;
		justify-content: center;
		align-items: center;
		flex-wrap: wrap;
	}

	.tag-area ul li {
		display: block;
		margin: 0px 5px 5px 0;
		padding: 2px 5px;
		color: #4496ec;
		font-size: 8px;
		font-weight: bold;
		text-align: center;
		background: #fff;
		border: 1px solid #4496ec;
		border-radius: 20px;
		cursor: pointer;
		transition: all .3s ease-out 0s;
	}

	.tag-area ul li:hover {
		color: #fff;
		background: #4496ec;
	}

	/* check box
	--------------------*/

	.common-search .ch {
		margin: 30px auto 0;
	}

	.common-search .ch .ch-open {
		width: 200px;
		height: 45px;
		padding: 12px 5px 12px 50px;
		font-size: 14px;
	}

	.common-search .ch .ch-open::before {
		left: 25px;
	}

	.common-search .ch .ch-open::after {
		left: 18px;
	}

	.common-search .ch .ch-inner {
		display: none;
		background: #fff;
		border-top: 2px solid #c5c5c5;
		border-bottom: 2px solid #c5c5c5;
	}

	.common-search .ch #ch_open:checked + .ch-open + .ch-inner {
		display: block;
		margin: 20px 0;
		padding: 20px 0;
	}

	.common-search .ch .ch-inner .ch-content p {
		width: 50%;
		margin: 10px 0;
	}

	.common-search .ch .ch-inner .ch-content .checkbox {
		position: relative;
		padding: 0 0 0 30px;
	}

}