@charset "utf-8";
@import url("css/reset.css");
/* CSS Document */

body {
	width: 100%;
	font-family: ArialMT, "Hiragino Kaku Gothic ProN", "ヒラギノ角ゴ ProN W3", メイリオ, sans-serif;
}

.clear:after {
	clear: both;
	content: "";
	display: block;
}

a {
	text-decoration: none;
}

img {
	max-width: 100%;
	max-height: 100%;
}

#wrap {
	overflow: hidden;
}

.img01 img {
	width: 100%;
	height: auto;
}

.img02 img {
	width: 100%;
	height: auto;
}

h2 img {
	width: 100%;
	height: auto;
}

h3 img {
	width: 100%;
	height: auto;
}

div img {
	width: 100%;
	height: auto;
}

li img {
	width: 100%;
	height: auto;
}

p img {
	width: 100%;
	height: auto;
}

/* header */
.inner_header {
	display: flex;
	justify-content: space-between;
	align-items: center;
	padding: 0.6rem 0.6rem 0.4rem;
}

.inner_header_logo {
	width: 40%;
}

.header_txt {
	width: 45%;
}

.header_tell {
	padding: 0 1rem 0.6rem;
}

/* promise */
.promise {
	margin-bottom: 30px;
}

.driver_attention {
	padding: 10px 20px 0;
}

/* footer */
#footer_area {
	padding-top: 30px;
}

#contact {
	clear: both;
	padding: 0 20px;
}

#contact p {
	display: flex;
	flex-direction: column;
	gap: 20px;
}

#linkList {
	clear: both;
	margin: 30px 20px 10px;
	word-break: break-all;
}

#linkList li {
	font-size: 117%;
	line-height: 150%;
	color: #000000;
}

#linkList a:hover {
	text-decoration: none;
}

#ftr {
	margin: 13px 0 0 0;
}

/* ct */
.ct_area {
	position: relative;
	padding-top: 20px;
}

.ct_area01 {
	position: relative;
}


.cv_btn01 {
	position: absolute;
	width: 80%;
	top: 77%;
	left: 50%;
	transform: translate(-50%, -50%);
}

.cv_btn01-02 {
	top: 54%;
}

.cv_btn02 {
	position: absolute;
	width: 80%;
	top: 87.5%;
	left: 50%;
	transform: translate(-50%, -50%);
}


.cv_btn03 {
	position: absolute;
	width: 68%;
	top: 62.5%;
	left: 50%;
	transform: translate(-50%, -50%);
}

.reason_area li {
	position: relative;
}

.reason_gif {
	position: absolute;
	width: 70%;
	top: 62.5%;
	left: 50%;
	transform: translate(-50%, -50%);
}

.reason_gif--03 {
	width: 68%;
	top: 50%;
	left: 48%;
}

.reason_gif--01 {
	top: 65%;
}


/* notice_area */
.notice_txt {
	font-size: 16px;
	text-align: center;
}

#notice_wrap {
	width: 100%;
	/*height: 300px;
	overflow-y:auto;*/
	margin-bottom: 20px;
	margin-top: 10px;
}

#notice_wrap::-webkit-scrollbar {
	width: 5px;
	background: #cccccc;
}

#notice_wrap::-webkit-scrollbar-thumb {
	background: #777;
	border-radius: 2px;
}

#notice_area {
	padding: 10px;
	border-radius: 10px;
	border: 1px solid #e61642;
	margin-bottom: 30px;
}

#notice_area p {
	font-size: 16px;
	margin-bottom: 20px;
}

#notice_area p .red {
	color: #e61673;
}

#notice_area .text01 span {
	border: 1px solid #000;
	padding: 2px;
}

#notice_area h4 {
	background: #fca9ce;
	padding: 7px;
	font-size: 15px;
	margin-bottom: 20px;
}

#notice_area .text02 {
	margin-bottom: 20px;
	font-size: 15px;
	font-weight: bold;
}

#notice_area .notice_list {
	padding-left: 20px;
}

#notice_area .notice_list li {
	margin-bottom: 20px;
}

#notice_area .notice_list p {
	font-size: 15px;
}


#notice_area .notice_list table {
	width: 100%;
	margin-top: 20px;
}

#notice_area .notice_list table tr td,
#notice_area .notice_list table tr th {
	padding: 10px;
	text-align: center;
	font-size: 15px;

}

#notice_area .notice_list table tr th {
	background: #c7e8fa;
}


#notice_area .text03 {
	font-size: 15px;
}


.check_box {
	margin: 0 auto 20px;
}

.btn_list {
	margin: 0 auto;
	width: 100%;
}

.btn_list li {
	font-size: 15px;
	border-radius: 5px;
	text-align: center;
}

.btn_list li:last-child {
	background: #b2b2b2;
	box-shadow: 0px 4px 0px 0px #7d7c7c;
}

.btn_list li:first-child {
	background: #e61673;
	box-shadow: 0px 4px 0px 0px #961a52;
	margin-bottom: 20px;
}

.btn_list li a {
	color: #fff;
	padding: 15px 20px;
	display: block;
}

.btn_animate {
	text-align: center;
	animation: fuwafuwa 2s ease 0s infinite alternate;
	transform-origin: center;
	cursor: pointer;
	display: inline-block;
	/* position: relative; */
	overflow: hidden;
}

.btn_animate:after {
	content: "";
	height: 200px;
	width: 30px;
	position: absolute;
	top: -180px;
	left: 0;
	background-color: #fff;
	opacity: 0;
	transform: rotate(45deg);
	animation: reflection 3s ease-in-out infinite;
}

@keyframes fuwafuwa {
	from {
		transform: translate(-50%, -50%) scale(0.9, 0.9);
	}

	to {
		transform: translate(-50%, -50%) scale(1, 1);
	}
}

@keyframes reflection {
	0% {
		-webkit-transform: scale(0) rotate(45deg);
		opacity: 0;
	}

	80% {
		-webkit-transform: scale(0) rotate(45deg);
		opacity: 0.5;
	}

	81% {
		-webkit-transform: scale(4) rotate(45deg);
		opacity: 1;
	}

	100% {
		-webkit-transform: scale(50) rotate(45deg);
		opacity: 0;
	}
}