@charset "UTF-8";
 
* {
	padding:0px;
	margin:0px;
 }
 
a {
	text-decoration:none;
	color:inherit;
 }
 
#all
{
	position:relative;
}
 
header
{
	position:fixed;
	width:100%;
	z-index:10;
	height:80px;
	background-color:#e3cbcb;
}
/* top */
#top_area
{
	position:relative;
}

#top_area > div
{
	position:relative;
	width:1200px;
	height:80px;
	margin:0px auto;
}


.top_left_area 
{
	position:relative;
	display:inline-block;
	height:80px;
	width:180px;
}

#big_toggle_area
{
	position:absolute;
	top:10px;
	left:100px;
	right:0px;
	bottom:0px;
	width:100px;
}

/*
#big_toggle_area > div
{
	position:absolute;
	height:80px;
	width:180px;
	background-color: #343536;
}
	*/

.toggle_on_area > span
{ 
	font-size: 50px;
}


.horro_v1
{
	position:absolute;
	top:0px;
	right:300px;
	display:inline-block;
}

.cute_v1
{
	position:absolute;
}

.top_left_area > div
{
	position:absolute;
	height:80px;
	width:180px;
	padding-left:290px;
	padding-top:5px;
}


.top_right_area 
{
	position:relative;
	display:inline-block;
	height:80px;
	width:1000px;

}

.top_right_area > div
{
	position:absolute;
	height:80px;
	width:1000px;
}

.top_right_area_ul
{
	position:relative;
	text-align:center;
	padding-top:25px;
	padding-left:90px;
}

.top_right_area_ul > li
{
	display:inline-block;
	font-size:19px;
	font-weight:bold;
	padding:0px 30px;
	transition:all 0.2s linear;
}

.top_right_area_ul > li:hover
{
	color:#ff0303;
	font-size:21px;
}


main
{
	top:80px;
}

/* // top */

/* content_area */
#content_area
{
	position:relative;
	height:500px;
	background-color:black;
}

#content_area > div
{
	position:relative;
	padding-top:80px;
}

.content_area_center
{
	position:relative;
	margin:0px auto;
	height:600px;
	width:1200px;
}

.content_area_left
{
	position:relative;
	display:inline-block;
	height:500px;
	width:600px;
}

.content_area_left > div
{
	position:absolute;
	height:500px;
	width:600px;
	padding-top:35px;
}

.content_area_right
{
	position:relative;
	display:inline-block;
	height:500px;
	width:590px;
}

.content_area_right > div
{
	position:absolute;
	height:500px;
	width:590px;
	padding-top:31px;
	padding-left:10px;
}

.content_box
{
	position:relative;
	height:350px;
	width:600px;
	border-radius:10px;
	background-color:white;
	overflow:hidden;
}

.content_box_img
{
	position:relative;
	height:350px;
	width:1900px;
	margin-left:0px;
}

.content_box_img > div
{
	display:inline-block;
}

.content_box_img > div > img
{
	width:100%;
}

.content_box_1
{
	position:relative;
	height:173px;
	width:600px;
	background-color:red;
	border-radius:10px;
	margin-top:5px;
}
/* // content_area*/

/* animated_area */
#animated_area
{
	position:relative;
	height:400px;
	background-color:#343536; 
}

#animated_area > div
{
	position:relative;
	width:1200px;
	margin:0px auto;
}

.animated_title_area
{
	position:relative;
	height:100px;
	padding-top:32px;
}
.animated_title_area > div
{
	position:relative;
}
.animated_title_area > div > h3
{
	font-size:70px;
	color:white;
}

.animated_intro_area
{
	position:relative;
	height:100px;
}

.animated_intro_area > div
{
	position:relative;
}

.animated_intro_area > div > p:nth-child(1)
{
	font-size:25px;
	color:white; /* #D3D3D3 */
	font-weight:bold;
	padding-top:19px;
}

.animated_intro_area > div > p:nth-child(3)
{
	font-size:18px;
	color:#D3D3D3;
	padding-top:7px;
}
.animated_intro_area > div > p:nth-child(5)
{
	font-size:18px;
	color:#D3D3D3;
}


.animate_button_area
{
	position:relative;
	height:100px;
}

.animate_button_area > div
{
	position:relative;
	padding-top:45px;
}

.animate_button_area > div > button
{
	font-size:23px;
	border-radius:9px;
	cursor:pointer;
	font-weight:bold;
	border:none;
	transition:all 0.2s linear;
}

.animate_button_area > div > button:hover
{
	background-color:#ff9292;
	color:white;
}

button
{
	padding:10px;
}
.amimate_card
{
	position:absolute;
	top:50px;
	left:615px;
	right:0px;
}
.amimate_card > div
{
	height:300px;
	width:600px;
	border-radius:10px;
	overflow:hidden;
}

.animate_img_area
{
	position:relative;
	width:3000px;
	margin-left:0px;
}

.animate_img_area > div
{
	display:inline-block;
}

.animate_span_button_area
{
	position:absolute;
	top:250px;
	width:600px;
	height:30px;
}

.animate_button_center
{
	position:relative;
	width:600px;
	height:30px;
	margin:0px auto;
	text-align:center;
	padding-top:20px;
}

.animate_button_center > span
{
	display:inline-block;
	width:20px;
	height:20px;
	background-color:#D3D3D3;
	border:1px solid #474747;
	cursor:pointer;
	border-radius:9px;
}
/* // animated_area */

/*interactive_area */
#interactive_area
{
	position:relative;
	height:400px;
	background-color:gray;
}

#interactive_area > div
{
	position:relative;
	width:1200px;
	margin:0px auto;
}

.interactive_title_area
{
	position:relative;
	height:100px;
	padding-top:30px;
}
.interactive_title_area > div
{
	position:relative;
}
.interactive_title_area > div > h3
{
	font-size:70px;
}

.interactive_intro_area
{
	position:relative;
	height:100px;	
	padding-top:20px;
}

.interactive_intro_area > div
{
	position:relative;
}

.interactive_intro_area > div > p:nth-child(1)
{
	font-size:25px;
	font-weight:bold;
}

.interactive_intro_area > div > p:nth-child(3)
{
	font-size:19px;
	padding-top:7px;
}
.interactive_button_area
{
	position:relative;
	height:100px;
}

.interactive_button_area > div
{
	position:relative;
	padding-top:30px;
}

.interactive_button_area > div > button
{
	font-size:23px;
	border-radius:9px;
	cursor:pointer;
	border:none;
	font-weight:bold;
	transition:all 0.2s linear;
}

.interactive_button_area > div > button:hover
{
	background-color:#ff9292;
	color:white;
}

.interactive_card
{
	position:absolute;
	top:50px;
	left:615px;
	right:0px;
}
.interactive_card > div
{
	height:300px;
	width:600px;
	border-radius:10px;
	background-color:blue;
}
/*// interactive_area */

/*story_area*/
#story_area
{
	position:relative;
	background-color:#D3D3D3;
	height:400px;
}

#story_area > div
{
	position:relative;
	width:1200px;
	margin:0px auto;
}

.story_title_area
{
	position:relative;
	height:100px;
	padding-top:30px;
}
.story_title_area > div
{
	position:relative;
}
.story_title_area > div > h3
{
	font-size:70px;
}

.story_intro_area
{
	position:relative;
	height:100px;
}

.story_intro_area > div
{
	position:relative;
}

.story_intro_area > div > p:nth-child(1)
{
	font-size:25px;
	font-weight:bold;
	padding-top:20px;
}

.story_intro_area > div > p:nth-child(3)
{
	font-size:19px;
}

.story_intro_area > div > p:nth-child(5)
{
	font-size:19px;
}



.story_button_area
{
	position:relative;
	height:100px;
}

.story_button_area > div
{
	position:relative;
	padding-top:40px;
}

.story_button_area > div > button
{
	font-size:20px;
	border:none;
	border-radius:9px;
	cursor:pointer;
	font-weight:bold;
	transition:all 0.2s linear;
}

.story_button_area > div > button:hover
{
	background-color:#ff9292;
	color:white;
}

.story_card
{
	position:absolute;
	top:50px;
	left:615px;
	right:0px;
}
.story_card > div
{
	height:300px;
	width:600px;
	border-radius:10px;
}
hr
{
	border:none;
}
/*// story_area*/

/* footor */
footer
{
	position:relative;
	height:200px;
	background-color:black;
	padding-top:80px;
}

footer > div
{
	position:relative;
	height:100px;
	width:1200px;
	margin:0px auto;
}

.by_area
{
	position:relative;
	text-align:center;
	color:white;
	font-size:60px;
}
/* // footor */

[class ^= "phone"]
{
	display:none;
}