@charset "utf-8";

.h1Img {
	margin-right: -15px;
	margin-left: -15px;
}

.js-fadeIn.appeared2 {
    transform: translateY(0);
    transition: none;
}

/*----------------------------
cr parts
----------------------------*/
.cr-text01 {
	display: inline-block;
	line-height: 1.6429;
}

.cr-colWrap01.col2 {
	justify-content: space-between;
	flex-wrap: wrap;
}

.cr-colWrap01 > .colBtnItem:nth-child(n+3) {
	margin-top: 15px;
}

.cr-listType01 > li::after {
	content: none;
}

.cr-listType02 > li + li {
	margin-top: 0;
}

.cr-box01 {
	padding: 12px;
	background-color: #fbfbfb;
}

@media screen and (max-width: 640px) {
	.cr-btnType01 {
		max-width: 380px;
		padding: 1.5715rem 2.5rem 1.6429rem;
	}
	.cr-colWrap02 > .colItem + .colItem {
		margin-top: 22px;
	}
}

/*---------------
modal
------------------*/
.modalOverlay {
	overflow: hidden;
}
.modalWrap .closeBtn {
	position: absolute;
	top: -26px;
	right: 0;
	padding-right: 16px;
	color: #fff;
	font-weight: bold;
}
.modalWrap .closeBtn > span {
	position: absolute;
	top: 50%;
	right: 0;
	display: block;
	width: 10px;
	height: 10px;
	transform: translateY(-50%) rotate(45deg);
}
.modalWrap .closeBtn > span::before,
.modalWrap .closeBtn > span::after {
	content: '';
	display: block;
	position: absolute;
	background-color: #fff;
}
.modalWrap .closeBtn > span::before {
	top: 50%;
	left: 0;
	width: 10px;
	height: 2px;
	margin-top: -1px;
}
.modalWrap .closeBtn > span::after {
	top: 0;
	left: 50%;
	width: 2px;
	height: 10px;
	margin-left: -1px;
}
.modalContent {
	top: calc(50% - 20px);
	margin-top: 20px;
	margin-bottom: 20px;
	max-height: calc(100vh - 50px);
	transform: translateY(calc(-50% + 5px));
}
.modalCnt {
	position: relative;
	padding: 36px 18px 30px;
	max-height: calc(100vh - 130px);
	overflow-y: hidden;
}
.modalWrap .inr {
	overflow-y: auto;
	max-height: calc(100vh - 190px);
}
.modalCnt.modalSelectBrand {
	padding: 36px 15px 24px;
}
.modalWrap .modalSelectBrand .inr {
	padding: 0 3px 6px;
}

.modalWrap .inr::-webkit-scrollbar{
	width: 10px;
}
.modalWrap .inr::-webkit-scrollbar-track {
	background: #fff;
	/* border-left: solid 1px #ececec; */
}
.modalWrap .inr::-webkit-scrollbar-thumb {
	background: #ccc;
	border-radius: 10px;
	-webkit-box-shadow: inset 0 0 0 2px #fff;
	box-shadow: inset 0 0 0 2px #fff;
}

@media screen and (max-width: 640px) {
	.modalContent {
		width: 98%;
	}
}
