@charset "utf-8";

/* ------------------------------
    reset
------------------------------ */
#detailWrap {
	font-size: 62.5%;
	background-color: #FFF !important;
}
#detailWrap *, #detailWrap *::before, #detailWrap *::after {
	box-sizing: border-box;
}
#detailWrap h1,#detailWrap h2,#detailWrap h3,#detailWrap h4,#detailWrap h5,#detailWrap h6,#detailWrap p,#detailWrap address,#detailWrap time,
#detailWrap ul,#detailWrap ol,#detailWrap li,#detailWrap dl,#detailWrap dt,#detailWrap dd,
#detailWrap table,#detailWrap th,#detailWrap td,#detailWrap img,
#detailWrap form,#detailWrap input,#detailWrap button,#detailWrap textarea,#detailWrap select {
	margin: 0;
	padding: 0;
	border: none;
	line-height: 100%;
	list-style-type: none;
	font-style: normal;
	font-weight: normal;
	font-family: メイリオ,Meiryo,"Hiragino Kaku Gothic Pro","ヒラギノ角ゴ Pro W3","ＭＳ Ｐゴシック",Arial,Verdana,sans-serif;
	word-wrap : break-word;
	overflow-wrap : break-word;
	word-break: break-all;
	-webkit-text-size-adjust: 100%;
}
#detailWrap input,#detailWrap button,#detailWrap textarea,#detailWrap select  {
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
	border: none;
	border-radius: 0;
	resize: none;
	outline: none;
	/* background: none; */
}
#detailWrap select::-ms-expand {
	display: none;
}
#detailWrap button:hover {
	cursor: pointer;
}
#detailWrap a {
	color: #000;
	text-decoration: none;
	transition: opacity 0.3s ease;
	outline: 1px solid transparent;
	-webkit-backface-visibility: hidden;
	backface-visibility: hidden;
}
#detailWrap a img {
	outline: 1px solid transparent;
	-webkit-backface-visibility: hidden;
	backface-visibility: hidden;
}
#detailWrap img, #detailWrap object {
	vertical-align: bottom;
	max-width: 100%;
	height: auto;
}

/* ------------------------------
    base
------------------------------ */

#detailWrap {
	color: #000;
	font-size: 1.0rem;
	text-align: left;
}
#detailWrap section {
	position: relative;
}
#detailWrap p,#detailWrap th,#detailWrap td,#detailWrap dt,#detailWrap dd,#detailWrap li,#detailWrap input,#detailWrap button,#detailWrap textarea {
	font-size: 1.4rem;
	line-height: 1.8;
}
#detailWrap p.txt {
	font-size: 1.4rem;
	line-height: 1.8;
}
#detailWrap .preload *,
#detailWrap .preload *::before,
#detailWrap .preload *::after {
	transition: none !important;
}

@media screen and (max-width : 768px) {
	#detailWrap {
		min-width: inherit;
	}
	#detailWrap p,#detailWrap th,#detailWrap td,#detailWrap dt,#detailWrap dd,#detailWrap li {
		font-size: 3.5vw;
	}
	#detailWrap input,#detailWrap textarea,#detailWrap select,#detailWrap .select {
		font-size: 16px!important;
	}
	#detailWrap p.txt {
		font-size: 3.5vw;
		line-height: 1.8;
	}
}

/* ------------------------------
    responsive
------------------------------ */
@media screen and (min-width : 769px) {
	#detailWrap .sp {
		display: none!important;
	}
	#detailWrap a:hover {
		opacity: .6;
	}
}

@media screen and (max-width : 768px) {
	#detailWrap .pc {
		display:none!important;
	}
}

/* ------------------------------
    style
------------------------------ */
#detailWrap .wrap{
	width: 100%;
	max-width: 500px;
	margin: 0 auto;
	/*padding-bottom: 19%;*/
}


/* cta
------------------------------ */

#detailWrap .cta_wrap {
	position: relative;
}
#detailWrap .cta_wrap .btn {
	position: absolute;
	bottom: 3%;
	left: 0;
	width: 100%;
	text-align: center;
}
#detailWrap .cta_wrap .btn img {
	width: 90%;
}

/* fv
------------------------------ */

#detailWrap .fv_wrap {
	position: relative;
}
#detailWrap .fv_wrap .btn {
	position: absolute;
	bottom: 35%;
	left: 19%;
	width: 100%;
	text-align: center;
}

@media screen and (max-width : 768px) {
	#detailWrap .fv_wrap .btn {
		bottom: 32%;
		left: 45%;
		width: 50%;
	}
}

/* slider
------------------------------ */
.slider_wrap {
	position: relative;
}

.slider_wrap .slider {
	position: absolute;
	left: 0;
	width: 100%;
}

.slider_voc .slider {
	top: 25%;
}

.slider_voc .slider .slick-slide {
	margin: 0 .282%;
}

.slider_voc .slider .slide-arrow {
	width: 69px;
	height: 69px;
	padding-top: 13.0555%;
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	background-size: 100% auto;
	z-index: 1;
	background-repeat: none;
	background-color: transparent;
}

.slider_voc .slider .slide-arrow.prev-arrow {
	background-image: url(../img/slick_awow_prev.png);
	left: 1.5%;
}

.slider_voc .slider .slide-arrow.next-arrow {
	background-image: url(../img/slick_awow_next.png);
	right: 0.7%;
}


/* acd
------------------------------ */
.acd_wrap {
	text-align: center;
}

.acd_wrap .acd-cnt {
	display: none;
}

.acd_wrap .acd-btn {
	cursor: pointer;
}


/* =================================================================
		画像の位置調整
================================================================= */
#detailWrap .nmt20{
	margin-top: -20px;
}
#detailWrap .nmt40{
	margin-top: -40px;
}
#detailWrap .nmt45{
	margin-top: -45px;
}
#detailWrap .nmt80{
	margin-top: -80px;
}

@media screen and (max-width : 768px) {
	#detailWrap .nmt40-sp{
		margin-top: -40px;
	}
}


@keyframes reflection {
    0% { transform: scale(0) rotate(45deg); opacity: 0; }
    80% { transform: scale(0) rotate(45deg); opacity: 0.5; }
    81% { transform: scale(4) rotate(45deg); opacity: 1; }
    100% { transform: scale(50) rotate(45deg); opacity: 0; }
}
@-webkit-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; }
}
@-moz-keyframes reflection {
    0% { -moz-transform: scale(0) rotate(45deg); opacity: 0; }
    80% { -moz-transform: scale(0) rotate(45deg); opacity: 0.5; }
    81% { -moz-transform: scale(4) rotate(45deg); opacity: 1; }
    100% { -moz-transform: scale(50) rotate(45deg); opacity: 0; }
}
@-ms-keyframes reflection {
    0% { -ms-transform: scale(0) rotate(45deg); opacity: 0; }
    80% { -ms-transform: scale(0) rotate(45deg); opacity: 0.5; }
    81% { -ms-transform: scale(4) rotate(45deg); opacity: 1; }
    100% { -ms-transform: scale(50) rotate(45deg); opacity: 0; }
}
@-o-keyframes reflection {
    0% { -o-transform: scale(0) rotate(45deg); opacity: 0; }
    80% { -o-transform: scale(0) rotate(45deg); opacity: 0.5; }
    81% { -o-transform: scale(4) rotate(45deg); opacity: 1; }
    100% { -o-transform: scale(50) rotate(45deg); opacity: 0; }
}