/* CSS Document */
* {
	outline:0;
	border:0;
	padding:0;
	margin:0;
}

.clear {
	clear:both;
}

body {
	font-family: 'Montserrat', sans-serif;
	text-align:center;
}

body:before {
	content:'';
	width:100%;
	height:100vh;
	position:fixed;
	left:0;
	top:0;	
	background:url('../img/bg_body.jpg') center center;
	background-size:cover;
}

.header {
	width:100%;
	height:70px;
	border-bottom:1px solid #d9dad6;
	background:#f7f7f4;
	position:fixed;
	top:0;
	left:0;
	z-index:25;
}

.header .logo {
	position:absolute;
	display:block;
	text-decoration:none;
	font-family: 'Caveat', cursive;
	height:60px;
	left:20px;
	top:5px;
}

.header .logo img {
	display:block;
	float:left;
	width:60px;
	margin-right:12px;
}

.header .logo h1 {
	font-weight:normal;
	float:left;
	font-size:40px;
	color:#df222a;
	line-height:60px;
}

.header .menu {
	display:inline-block;
	padding-top:20px;
}

.header .menu ul {
	list-style-type: none;	
}

.header .menu ul li {
	float:left;
	margin-left:8px;
	margin-right:8px;
}

.header .menu ul li a {
	color:#212121;
	padding-left:2px;
	padding-right:2px;	
	display:block;
	text-decoration:none;
	font-size:14px;
	font-weight:500;
	line-height:30px;
	position:relative;
}

.header .menu ul li a:before {
	content:'';
	position:absolute;
	left:50%;
	top:22px;
	border-bottom:1px solid #212121;
	height:1px;
	width:0;
	
	transition:all 0.2s;
}

.header .menu ul li a:hover:before {
	left:0;
	width:100%;
}

.header .mobile_menu {
	width:60px;
	height:60px;
	background:url('../img/mobile_menu.png') center center no-repeat;
	background-size:40px auto;
	position:absolute;
	top:6px;
	right:10px;
	display:none;
}

.for_pen_container {
	position:fixed;
	width:100%;
	height:calc(100vh - 80px);
	top:0;
	left:0;
	padding-top:80px;
}

.for_pen_container.clip {
	z-index:20;
	pointer-events: none;
}

.for_pen_container .pen_container {
	margin:auto;
	width:calc(100% - 40px);
	max-width:840px;
	height:calc(100vh - 100px);
	max-height:740px;
	position:relative;
}

.for_pen_container .pen_container img {
	position:absolute;
	right:0;
	top:0;
	height:100%;
}

.for_content {
	width:100%;
	height:100vh;
}

.for_content .fixed_content {
	width:100%;
	height:calc(100vh - 120px);	
	position:relative;
	padding-top:120px;
}

.for_content .fixed_content.fixed {
	position:fixed;
	left:0;
	top:0;
}

.for_content .fixed_content .sheet {
	margin:auto;
	width:calc(100% - 40px);
	max-width:840px;
	height:calc(100vh - 170px);
	border:1px solid #d7d0b8;
	background:#ffffff;
	-webkit-box-shadow: inset 0px 0px 100px 100px rgba(0, 0, 0, 0.05);
	-moz-box-shadow:    inset 0px 0px 100px 100px rgba(0, 0, 0, 0.05);
	box-shadow:         inset 0px 0px 100px 100px rgba(0, 0, 0, 0.05);
	z-index:2;
	display:table;
	text-align:left;
}

.for_content.home .fixed_content .sheet {
	border:0;
	background:transparent;
	text-align:right;
	-webkit-box-shadow: none;
	-moz-box-shadow:    none;
	box-shadow:         none;
}

.for_content .fixed_content .sheet .content {
	display:table-cell;
	padding:30px;
	padding-right:60px;
	vertical-align:middle;
}

.for_content.home .fixed_content .sheet .content {
	padding-right:100px;
	position:relative;
}

.for_content.home .fixed_content .sheet .content .arrow_next {
	width:40px;
	position:absolute;
	left:calc(50% - 20px);
	bottom:10px;
	cursor:pointer;
	
	transition:all 0.1s;
}

.for_content.home .fixed_content .sheet .content .arrow_next:hover {
	bottom:0;
	padding-top:10px;
}

.for_content .fixed_content .sheet .content h2 {
	font-size:36px;
	color:#df222a;
	font-family: 'Caveat', cursive;
	padding-bottom:30px;
	font-weight:normal;
}

.for_content .fixed_content .sheet .content h3 {
	font-size:28px;
	font-family: 'Caveat', cursive;
	padding-bottom:8px;
	font-weight:normal;
}

.for_content .fixed_content .sheet .content p {
	font-size:13px;
	line-height:18px;
	color:#212121;
	padding-bottom:18px;
}

.for_content.home .fixed_content .sheet .content p {
	padding-left:calc(100% - 400px);
}

.for_content .fixed_content .sheet .content p strong {
	font-weight:600;
}

.for_content.home .fixed_content .sheet .content p.note {
	color:#d1c1ae;
}

.for_content .fixed_content .sheet .content p a {
	color:#df222a;
}

.for_content .fixed_content .sheet .content ul {
	list-style-type: none;
}

.for_content .fixed_content .sheet .content ul li {
	font-size:13px;
	line-height:18px;
	color:#212121;
	padding-bottom:5px;
	padding-left:20px;
	position:relative;
}

.for_content .fixed_content .sheet .content ul li:before {
	content:"›";
	font-family:Arial;
	font-weight:bold;
	font-size:16px;
	position:absolute;
	left:0;
	top:0;
	line-height:18px;
	color:#d1c1ae;
}

.for_content .fixed_content .sheet .content .form {
	
}

.for_content .fixed_content .sheet .content .form .form_item {
	padding-bottom:10px;
}

.for_content .fixed_content .sheet .content .form .form_item .label {
	font-size:11px;
}

.for_content .fixed_content .sheet .content .form .form_item input[type="text"] {
	display:block;
	border:1px solid #d1c1ae;
	width:calc(100% - 22px);
	padding-left:10px;
	padding-right:10px;
	height:30px;
	background:#ffffff;
	font-family: 'Montserrat', sans-serif;
	font-size:13px;
}

.for_content .fixed_content .sheet .content .form .form_item textarea {
	display:block;
	border:1px solid #d1c1ae;
	width:calc(100% - 22px);
	padding:10px;
	height:30px;
	background:#ffffff;
	font-family: 'Montserrat', sans-serif;
	font-size:13px;
	font-weight:16px;
	resize:none;
	height:90px;
}

.for_content .fixed_content .sheet .content .form .form_item input[type="file"] {
	width:100%;
	height:30px;
	opacity:0;
	position:absolute;
	right:0;
	top:0;
}

.for_content .fixed_content .sheet .content .form .form_item input[type="text"].v_err,
.for_content .fixed_content .sheet .content .form .form_item textarea.v_err {
	border:1px solid #df222a;
	outline:1px solid #df222a;
}

.for_content .fixed_content .sheet .content .form .form_item .for_file {
	position:relative;
}

.for_content .fixed_content .sheet .content .form .form_item .for_file input[type="button"] {
	position:absolute;
	pointer-events: none;
	background:#d1c1ae;
	color:#ffffff;
	font-family: 'Montserrat', sans-serif;
	padding-left:15px;
	padding-right:15px;
	height:32px;
	font-size:13px;
	top:0;
	right:0;
	display:block;
	-webkit-appearance: none;
	border-radius: 0;
}

.for_content .fixed_content .sheet .content .form .form_item input[type="submit"] {
	float:right;
	background:#df222a;
	font-family: 'Montserrat', sans-serif;
	font-size:14px;
	color:#ffffff;
	padding-left:20px;
	padding-right:20px;
	height:40px;
	margin-top:10px;
	-webkit-appearance: none;
	border-radius: 0;
}

input::-webkit-input-placeholder { /* WebKit browsers */
    color:#d1c1ae;
}
input:-moz-placeholder { /* Mozilla Firefox 4 to 18 */
	color:#d1c1ae;
}
input::-moz-placeholder { /* Mozilla Firefox 19+ */
	color:#d1c1ae;
}
input:-ms-input-placeholder { /* Internet Explorer 10+ */
	color:#d1c1ae;
}

