
/*pc_css*/
@media screen and (min-width:751px){
	
	#index{
		width:100%;
		position: relative;
	}

	
	#index .rightbox{
		width:50%;
		position: fixed;
		height:100%;
		background:url("../images/index/index_img01.jpg") 50% top no-repeat;
		background-size:cover;
		top:0;
		right:0;
	}
	
	#index .rightbox .titlebox{
		width:100%;
		padding:0 20% 0 20%;
		box-sizing: border-box;
		position: relative;
		top:25%;
		
	}
	
	#index .rightbox .titlebox img{
		width:100%;
		height: auto;
		
	}
	
	#index .leftbox{
		width:50%;
		margin:0 50% 0 0 ;
	}
	
	#index .leftbox .innerbox{
		padding:80px 14% 90px 14%;
		width:100%;
		box-sizing: border-box;
	}
	
	#index .leftbox .logobox{
		width:200px;
		margin:0 auto 20px;
	}
	
	/*** Add By seiji 07/04/2018 ***/
	#index .leftbox .logobox1{
		width:100px;
		margin:20px;
		float:left;
	}
	
	#index .leftbox .title_box {
		float:left;
		display: block;
		margin: 60px 0 0 110px;
		font-size:32px;
		font-weight:700;
	}
	
	/*** Add end By Seiji ***/
	
	#index .leftbox .clear {clear:both;}
	
	#index .leftbox .subtx01{
		margin:0 0 45px 0;
		font-size:1.7em;
		line-height: 1.5em;
	}

	#index .leftbox .subtx01{
		margin:0 0;
		font-size:1.7em;
		line-height: 1.5em;
	}
	
	#index .leftbox .selectbtn{
		border:1px solid #2b2b2b;
		padding:5px 0;
		box-sizing: border-box;
		margin:0 0 60px 0;
	}
	
	#index .leftbox .selectbtn .inbtn{
		display: block;
		float: left;
		width:50%;
		box-sizing: border-box;
		border-right:1px solid #2b2b2b;
		padding:0 5px;
	}
	
	#index .leftbox .selectbtn .inbtn:last-child{
		border-right:none;
	}
	
	#index .leftbox .selectbtn .inbtn a{
		text-align: center;
		padding:15px 0;
		display: block;
		text-decoration: none;
		color:#2b2b2b;
		opacity:1;
    	transition:all 0.3s;
	}
	
	#index .leftbox .selectbtn .inbtn a:hover{
		background:#2b2b2b;
		color:#f6f6f6;
	}
	/*** Add by Seiji 7/04/2018 ***/
	#index .leftbox .signupbtn {
		display: block;
		width: 100%;
		border-bottom:1px solid #2b2b2b;
		border-left:1px solid #2b2b2b;
		border-right:1px solid #2b2b2b;
		padding:5px 0;
		box-sizing: border-box;
		margin:0 0 60px 0;
	}
	
	#index .leftbox .signupbtn a{
		text-align: center;
		padding:15px 0;
		display: block;
		text-decoration: none;
		color:#2b2b2b;
		opacity:1;
    	transition:all 0.3s;
	}
	
	#index .leftbox .signupbtn a:hover {
		background:#2b2b2b;
		color:#f6f6f6;
	}
	
	#index .leftbox .textbox .sponsorbtn, 
	#index .leftbox .textbox .sugarbtn, 
	#index .leftbox .textbox .scoutbtn {
    	padding: 40px 0 0 0;
    	width: 80%;
    	margin: 0 auto;
    	max-width: 350px;
    }
    
    #index .leftbox .textbox .sponsorbtn a{
    	border: 5px solid #e1e4e7;
    	background: #212943;
    	color: #fff;
    	text-decoration: none;
    	width: 100%;
    	text-align: center;
    	display: inline-block;
    	padding: 25px 10px;
    	box-sizing: border-box;
    	line-height: 1.5em;
   	 	border-radius: 10px;
    	-moz-border-radius: 10px;
    	-webkit-border-radius: 10px;
    	transition: all 0.3s;
    }
    
    #index .leftbox .textbox .sponsorbtn a:hover{
    	border:5px solid #212943;
		background:#fff;
		color:#212943;
	}
	 #index .leftbox .textbox .sugarbtn a{
	 	border: 5px solid #f2cecd;
    	background: #cc2222;
    	color: #fff;
    	text-decoration: none;
    	width: 100%;
    	text-align: center;
    	display: inline-block;
    	padding: 25px 10px;
    	box-sizing: border-box;
    	line-height: 1.5em;
    	border-radius: 10px;
    	-moz-border-radius: 10px;
    	-webkit-border-radius: 10px;
    	transition: all 0.3s;
    }
    
    #index .leftbox .textbox .sugarbtn a:hover{
    	border:5px solid #cc2222;
		background:#fff;
		color:#212943;
	}
	
	#index .leftbox .textbox .scoutbtn a {
		border: 5px solid #ffffcc;
    	background: #dddd33;
    	color: #fff;
    	text-decoration: none;
    	width: 100%;
    	text-align: center;
    	display: inline-block;
    	padding: 25px 10px;
    	box-sizing: border-box;
    	line-height: 1.5em;
    	border-radius: 10px;
    	-moz-border-radius: 10px;
    	-webkit-border-radius: 10px;
    	transition: all 0.3s;
    }
    #index .leftbox .textbox .scoutbtn a:hover{
    	border:5px solid #dddd33;
		background:#fff;
		color:#212943;
	}
		/*** Add end by Seiji ***/
	
	#index .leftbox .textbox{
		width:100%;
		background:#fff;
		/*border-bottom:2px solid #eaeaea;*/
		padding:25px 10px 10px 10px;
		box-sizing: border-box;
		text-align: center;
	}
	
	#index .leftbox .textbox .tl{
		font-family: 'Raleway', sans-serif;
		font-weight: 300;
		font-size:2em;
		display: inline-block;
		padding:0 0 10px 0;
		margin:0 0 20px 0;
		border-bottom:1px solid #2b2b2b;
	}
	
	#index .leftbox .textbox .tx{
		line-height: 2em;
		margin:0 0 50px 0;
		text-align: left;
		padding:0 30px;
		font-size:0.95em;
	}
	
	#index .leftbox .textbox .selectbtn2{
		width:100%;
	}
	
	#index .leftbox .textbox .selectbtn2 .inbtn{
 		width: 50%;
		padding:0 5px 0 0;
		box-sizing: border-box;
		float: left;
	}
	
	#index .leftbox .textbox .selectbtn2 .inbtn:last-child{
 		width: 50%;
		padding:0 0 0 5px;
		box-sizing: border-box;
	}
	
	#index .leftbox .textbox .selectbtn2 .inbtn .inbox{
		padding-top: 66.66%;
		position: relative;
		background:#b76e29;
	}
	
	#index .leftbox .textbox .selectbtn2 .inbtn .inbox .intx{
		text-align: center;
		font-weight: bold;
		font-size:1.4em;
		position: absolute;
		top:45%; /*** Modified by Seiji ***/
		margin:-0.3em 0 0 0;
		width:100%;
		box-sizing: border-box;
		background:url("../images/index/arrow.png") no-repeat;
		background-size:11px;
		background-position: right 10px top 50%;
	}
	
	#index .leftbox .textbox .selectbtn2 .inbtn .inbox a{
		width:100%;
		height:100%;
		display: block;
		position: absolute;
		top:0;
		left:0;
		overflow: hidden;
		text-decoration: none;
		color:#fff;:
	}
	
	#index .leftbox .textbox .selectbtn2 .inbtn .inbox a img{
		-moz-transition: -moz-transform 0.5s ease-out;
    	-webkit-transition: -webkit-transform 0.5s ease-out;
    	-o-transition: -o-transform 0.5s ease-out;
    	-ms-transition: -ms-transform 0.5s ease-out;
    	transition: transform 0.5s ease-out,opacity 0.5s;
		opacity:1;
	}
	
	#index .leftbox .textbox .selectbtn2 .inbtn .inbox:hover a img{
		-webkit-transform: scale(1.1);
    	-moz-transform: scale(1.1);
    	-o-transform: scale(1.1);
    	-ms-transform: scale(1.1);
    	transform: scale(1.1);
		opacity:0.8;
	}
	
	#index .leftbox .signup-step{
		width:100%;
		background:#fff;
		padding:25px 10px 10px 10px;
		box-sizing: border-box;
		text-align: left;
	}
	
	#index .leftbox .signup-step h2{
	    font-size: 18px;
    	line-height: 24px;
    	background-color: #EFEFEF;
    	background: linear-gradient(#ECECEC, #EFEFEF);
    	padding: 5px 15px 5px 15px;
    	margin: 0px -15px 15px -15px;
    }
	
	#index .leftbox .signup-step h3{
	    font-size: 14px;
    	line-height: 20px;
		padding: 5px 15px 5px 15px;
    	margin: 0px -15px 15px -15px;
    }
    
	#index .leftbox .signup-step span{color: #e50000;}
	
	#index .leftbox .signup-step a {
		color: #e50000;
		text-decoration: none;
	}
	
	#index .leftbox .signup-step a:hover {color: #ccc;}
	
	#index .leftbox .signup-step .border-box{
		position: relative;
    	border: 1px solid #bababa;
    	width: 200px;
    	border-radius: 6px;
    	overflow: hidden;
    	float:left;
    	outline: 0;
    	background: #fafafa url("https://lecoeur.us/eng/images/index/arrow_down.png") no-repeat right center;
    	height: 34px;
    	vertical-align: middle;
    	display: inline-block;
    	margin: 12px 8px;
	}
	
	#index .leftbox .signup-step .border-box1{
		position: relative;
    	border: 1px solid #bababa;
    	width: 200px;
    	border-radius: 6px;
    	overflow: hidden;
    	float:left;
    	outline: 0;
    	background: #fafafa;
    	height: 34px;
    	vertical-align: middle;
    	display: inline-block;
    	margin: 12px 8px;
	}
	
	#index .leftbox .signup-step .border-box select{
		box-sizing: content-box;
    	-moz-box-sizing: content-box;
    	-webkit-box-sizing: content-box;
    	-webkit-appearance: none;
    	-moz-appearance: none;
    	-moz-user-select: none;
    	appearance: none;
    	margin: 0px;
    	padding: 5px 50px 5px 8px;
    	width: 170px;
    	outline: 0;
    	border: none;
    	box-shadow: none;
    	background: transparent;
    	background-image: none;
    	cursor: pointer;
    	height: 22px;
    	overflow: hidden;
    	white-space: nowrap;
    	text-overflow: ellipsis;
    	word-break: break-all;
    	color: inherit;
    	font-family: inherit;
    	text-indent: 0px;
    	line-height: 14px;
    }
	
	#index .leftbox .footer{
		border-top:1px solid #2b2b2b;
		padding:25px 0;
		text-align: center;
		font-size:0.85em;
		background:#f6f6f6;
	}
	
	input[type=radio], input[type=checkbox] {
  		/*display: none;*/
	}

	.checkbox {
  		box-sizing: border-box;
  		-webkit-transition: background-color 0.2s linear;
  		transition: background-color 0.2s linear;
  		position: relative;
  		display: inline-block;
  		margin: 0 20px 8px 0;
  		padding: 12px 12px 12px 42px;
  		border-radius: 8px;
  		background-color: #fff;
  		vertical-align: middle;
  		cursor: pointer;
	}
	.checkbox:hover {
  		background-color: #f6f7f8;
	}
	.checkbox:hover:after {
  		border-color: #9ac8e9;
	}
 	.checkbox:after {
  		-webkit-transition: border-color 0.2s linear;
  		transition: border-color 0.2s linear;
  		position: absolute;
  		top: 50%;
  		left: 15px;
  		display: block;
  		margin-top: -10px;
  		width: 16px;
  		height: 16px;
  		border: 2px solid #bbb;
  		border-radius: 6px;
  		content: '';
	}

	.checkbox:before {
  		-webkit-transition: opacity 0.2s linear;
  		transition: opacity 0.2s linear;
  		position: absolute;
  		top: 50%;
  		left: 21px;
  		display: block;
  		margin-top: -7px;
  		width: 5px;
  		height: 9px;
  		border-right: 3px solid #9ac8e9;
  		border-bottom: 3px solid #9ac8e9;
  		content: '';
  		opacity: 0;
  		-webkit-transform: rotate(45deg);
  		-ms-transform: rotate(45deg);
  		transform: rotate(45deg);
	}
	input[type=checkbox]:checked + .checkbox:before {
  		opacity: 1;
	}
	
	form input[type="text"], form input[type="email"], form input[type="password"], form select:focus, form textarea {
		-moz-appearance: none;
    	/* -webkit-appearance: none; */
    	-ms-appearance: none;
    	appearance: none;
    	-moz-transition: all 0.2s ease-in-out, color 0.2s ease-in-out;
    	-webkit-transition: all 0.2s ease-in-out, color 0.2s ease-in-out;
    	-ms-transition: all 0.2s ease-in-out, color 0.2s ease-in-out;
    	transition: all 0.2s ease-in-out, color 0.2s ease-in-out;
    	display: block;
    	width: 45%;
    	/*height: 22px;*/
    	padding: 5px 0 5px 8px;
    	margin: 8px;
    	background: none;
    	border: solid 2px rgba(185, 186, 187, 0.25);
    	color: inherit;
    	border-radius: 0.5em;
    	outline: none;
	}
	
	form input[type="text"]:focus,
	form input[type="email"]:focus,
	form select:focus,
	form input[type="password"]:focus,
	form textarea:focus {
		border-color: #9ac8e9;
	}
	
	input[type="submit"],
	.button,
	button {
		-moz-appearance: none;
		-webkit-appearance: none;
		-ms-appearance: none;
		appearance: none;
		-moz-transition: all 0.2s ease-in-out;
		-webkit-transition: all 0.2s ease-in-out;
		-ms-transition: all 0.2s ease-in-out;
		transition: all 0.2s ease-in-out;
		background-color: #9ac8e9;
		border: 0;
		border-radius: 0.5em;
		color: #fff;
		cursor: pointer;
		display: inline-block;
		height: 3.5em;
		line-height: 3.5em;
		outline: 0;
		padding: 0 2em 2.75em 2em;
		position: relative;
		text-align: center;
		text-decoration: none;
	}
	input[type="submit"]:hover,
	.button:hover,
	button:hover {
		background-color: #ccc;
	}
	input[type="submit"]:active,
	.button:active,
	button:active {
		background-color: #9ac8e9;
	}
	
}
@media screen and (min-width:1285px){
	#index .leftbox .subtitle_box, .subtitle_box1 {
		float:right;
		display: block;
		margin: 45px 20px 0 0;
		font-size:14px;
		font-weight:700;
		max-width:75%;
		line-height: 22px;
	}
	
	#index .leftbox .subtitle_box1 { margin: 20px 20px 0 0;}
}
@media screen and (max-width:1284px){
	#index .leftbox .subtitle_box, .subtitle_box1{
		float:right;
		display: block;
		margin: 30px 15px 0 0;
		font-size:11px;
		font-weight:700;
		max-width:65%;
		line-height: 18px;
	}
}
@media screen and (max-width:1035px){
	#index .leftbox .logobox1{
		width:70px;
		margin:15px;
		float:left;
	}
}
@media screen and (max-width:750px){
	#index{
		width:100%;
		position: relative;
	}

	
	#index .rightbox{
		width:90%;
		height:480px;
		position: relative;
		background:url("../images/index/index_img01.jpg") 50% top no-repeat;
		background-size:cover;
		margin:5% auto 0;
	}
	
	#index .rightbox .subtx01{
		font-size:1.1em;
		color:#fff;
		line-height: 1.5em;
		padding:20px 0 50px 0;
		
	}
	
	#index .rightbox .titlebox{
		width:240px;
		padding:20px 0 0 0;
		margin:0 auto;
		
	}
	
	#index .rightbox .titlebox img{
		width:100%;
		height: auto;
		
	}
	
	#index .leftbox{
		width:100%;
		margin:0 0 0 0 ;
		position: relative;
		z-index:1000;
	}
	
	#index .leftbox .innerbox{
		padding:5% 5% 50px 5%;
		width:100%;
		box-sizing: border-box;
	}
	
	#index .leftbox .logobox{
		width:140px;
		margin:0 auto 20px;
	}
	
	#index .leftbox .subtx01{
		margin:0 0 30px 0;
		font-size:1.1em;
		line-height: 1.5em;
	}
	
	#index .leftbox .selectbtn{
		border:1px solid #2b2b2b;
		padding:5px 0;
		box-sizing: border-box;
		/*margin:0 0 40px 0;*/
	}
	
	#index .leftbox .selectbtn .inbtn{
		display: block;
		float: left;
		width:50%;
		box-sizing: border-box;
		border-right:1px solid #2b2b2b;
		padding:0 5px;
	}
	
	#index .leftbox .selectbtn .inbtn:last-child{
		border-right:none;
	}
	
	#index .leftbox .selectbtn .inbtn a{
		text-align: center;
		padding:15px 0;
		display: block;
		text-decoration: none;
		color:#2b2b2b;
		opacity:1;
    	transition:all 0.3s;
	}
	
	#index .leftbox .selectbtn .inbtn a:hover{
		background:#2b2b2b;
		color:#f6f6f6;
	}
	
	#index .leftbox .textbox{
		width:100%;
		background:#fff;
		border-bottom:2px solid #eaeaea;
		padding:25px 10px 10px 10px;
		box-sizing: border-box;
		text-align: center;
	}
	
	#index .leftbox .textbox .tl{
		font-family: 'Raleway', sans-serif;
		font-weight: 300;
		font-size:2em;
		display: inline-block;
		padding:0 0 10px 0;
		margin:0 0 20px 0;
		border-bottom:1px solid #2b2b2b;
	}
	
	#index .leftbox .textbox .tx{
		line-height: 2em;
		margin:0 0 40px 0;
		text-align: left;
		padding:0 0;
		font-size:0.95em;
	}
	
	#index .leftbox .textbox .selectbtn2{
		width:100%;
	}
	
	#index .leftbox .textbox .selectbtn2 .inbtn{
 		width: 50%;
		padding:0 5px 0 0;
		box-sizing: border-box;
		float: left;
	}
	
	#index .leftbox .textbox .selectbtn2 .inbtn:last-child{
 		width: 50%;
		padding:0 0 0 5px;
		box-sizing: border-box;
	}
	
	#index .leftbox .textbox .selectbtn2 .inbtn .inbox{
		padding-top: 86.66%;
		position: relative;
		background:#b76e29;
	}
	
	#index .leftbox .textbox .selectbtn2 .inbtn .inbox .intx{
		text-align: center;
		font-weight: bold;
		font-size:1.4em;
		position: absolute;
		top:50%;
		margin:-0.3em 0 0 0;
		width:100%;
		box-sizing: border-box;
		background:url("../images/index/arrow.png") no-repeat;
		background-size:11px;
		background-position: right 10px top 50%;
	}
	
	#index .leftbox .textbox .selectbtn2 .inbtn .inbox a{
		width:100%;
		height:100%;
		display: block;
		position: absolute;
		top:0;
		left:0;
		overflow: hidden;
		text-decoration: none;
		color:#fff;:
	}
	
	#index .leftbox .textbox .selectbtn2 .inbtn .inbox a img{
		-moz-transition: -moz-transform 0.5s ease-out;
    	-webkit-transition: -webkit-transform 0.5s ease-out;
    	-o-transition: -o-transform 0.5s ease-out;
    	-ms-transition: -ms-transform 0.5s ease-out;
    	transition: transform 0.5s ease-out,opacity 0.5s;
		opacity:1;
	}
	
	#index .leftbox .textbox .selectbtn2 .inbtn .inbox:hover a img{
		-webkit-transform: scale(1.1);
    	-moz-transform: scale(1.1);
    	-o-transform: scale(1.1);
    	-ms-transform: scale(1.1);
    	transform: scale(1.1);
		opacity:0.8;
	}
	
	#index .leftbox .footer{
		border-top:1px solid #2b2b2b;
		padding:25px 0;
		text-align: center;
		font-size:0.85em;
		background:#f6f6f6;
	}
	#index .leftbox .logobox1{display: none;}	
	#index .leftbox .title_box {display: none;}
	#index .leftbox .subtitle_box {display:none;}
	
	#index .leftbox .signupbtn {
		display: block;
		width: 100%;
		border-bottom:1px solid #2b2b2b;
		border-left:1px solid #2b2b2b;
		border-right:1px solid #2b2b2b;
		padding:5px 0;
		box-sizing: border-box;
		margin:0 0 60px 0;
	}
	
	#index .leftbox .signupbtn a{
		text-align: center;
		padding:15px 0;
		display: block;
		text-decoration: none;
		color:#2b2b2b;
		opacity:1;
    	transition:all 0.3s;
	}
	
	#index .leftbox .signupbtn a:hover {
		background:#2b2b2b;
		color:#f6f6f6;
	}
	
	#index .leftbox .textbox .sponsorbtn a{
    	border: 5px solid #e1e4e7;
    	background: #212943;
    	color: #fff;
    	text-decoration: none;
    	width: 85%;
    	text-align: center;
    	display: inline-block;
    	padding: 25px 10px;
    	box-sizing: border-box;
    	line-height: 1.5em;
   	 	border-radius: 10px;
    	-moz-border-radius: 10px;
    	-webkit-border-radius: 10px;
    	transition: all 0.3s;
    }
    
    #index .leftbox .textbox .sponsorbtn a:hover{
    	border:5px solid #212943;
		background:#fff;
		color:#212943;
	}
	
	#index .leftbox .textbox .sugarbtn a{
	 	border: 5px solid #f2cecd;
    	background: #cc2222;
    	color: #fff;
    	text-decoration: none;
    	width: 85%;
    	text-align: center;
    	display: inline-block;
    	padding: 25px 10px;
    	box-sizing: border-box;
    	line-height: 1.5em;
    	border-radius: 10px;
    	-moz-border-radius: 10px;
    	-webkit-border-radius: 10px;
    	transition: all 0.3s;
    }
    
    #index .leftbox .textbox .sugarbtn a:hover{
    	border:5px solid #cc2222;
		background:#fff;
		color:#212943;
	}
	
	#index .leftbox .textbox .scoutbtn a {
		border: 5px solid #ffffcc;
    	background: #dddd33;
    	color: #fff;
    	text-decoration: none;
    	width: 85%;
    	text-align: center;
    	display: inline-block;
    	padding: 25px 10px;
    	box-sizing: border-box;
    	line-height: 1.5em;
    	border-radius: 10px;
    	-moz-border-radius: 10px;
    	-webkit-border-radius: 10px;
    	transition: all 0.3s;
    }
    
    #index .leftbox .textbox .scoutbtn a:hover{
    	border:5px solid #dddd33;
		background:#fff;
		color:#212943;
	}
	
	#index .leftbox .signup-step{
		width:100%;
		background:#fff;
		padding:25px 10px 10px 10px;
		box-sizing: border-box;
		text-align: left;
	}
	
	#index .leftbox .signup-step .border-box{
		position: relative;
    	border: 1px solid #bababa;
    	width: 60%;
    	border-radius: 6px;
    	overflow: hidden;
    	float:left;
    	outline: 0;
    	background: #fafafa url('file:///C:/Users/rens1/OneDrive/Desktop/Mika/bluehost/lecoeur.us/eng/images/index/arrow_down.png') no-repeat right center;
    	height: 34px;
    	vertical-align: middle;
    	display: inline-block;
    	margin: 12px 8px;
	}
	
	#index .leftbox .signup-step .border-box select{
		box-sizing: content-box;
    	-moz-box-sizing: content-box;
    	-webkit-box-sizing: content-box;
    	-webkit-appearance: none;
    	-moz-appearance: none;
    	-moz-user-select: none;
    	appearance: none;
    	margin: 0px;
    	padding: 5px 50px 5px 8px;
    	width: 60%;
    	outline: 0;
    	border: none;
    	box-shadow: none;
    	background: transparent;
    	background-image: none;
    	cursor: pointer;
    	height: 22px;
    	overflow: hidden;
    	white-space: nowrap;
    	text-overflow: ellipsis;
    	word-break: break-all;
    	color: inherit;
    	font-family: inherit;
    	text-indent: 0px;
    	line-height: 14px;
    }
    
    #index .leftbox .signup-step span{color: #e50000;}
	
	#index .leftbox .signup-step a {
		color: #e50000;
		text-decoration: none;
	}
	
	#index .leftbox .signup-step a:hover {color: #ccc;}
	
	#index .leftbox .signup-step p {display: b;ock;}
}
	