/*---------------------------------------
form
----------------------------------------*/
@charset "utf-8";
html { scroll-behavior: smooth;}
body { font-family: 'Roboto', 'Noto Sans JP', "Helvetica Neue", Arial, "Hiragino Kaku Gothic ProN", Meiryo, sans-serif; 
color: #333; font-size: 18px; margin: 0; width: 100%; }

ul,li,ol {
	list-style: none;
	margin: 0;
	padding: 0;
}
.sp-only {
	display: none;
}
#header {
	background: #fff;
}
.header_content {
	max-width: 1024px;
	height: 90px;
	margin: 0 auto;
	display: flex;
	justify-content: space-between;f;
}
.header_emesg {
	max-width: 740px;
	margin: 0 auto;
}
.header_content li img {
	padding: 0.6rem 1rem;
}
h1 {
	max-width: 900px;
	margin: 14px auto;
    color: #0E9AE2;
    border-bottom: solid 2px;
    text-align: center;
    font-size: 1.6rem;
    padding: 4px 0;
}
/*---------------------------------------*/
error

.header_emesg {
	text-align:center;
	color:red;
	font-weight:bold;
	font-size:120%;
}
.name_msg {
	position:relative;
	left:40px;
	color:red;
	font-weight:bold;
}
.msg {
	margin-left:10px;
	color:red;
	font-weight:bold;
}
.phone_msg {
	color:red;
	font-weight:bold;
}
/*----------------------------------------*/

#container {
	background: #e6e6e6;
}
.form-title {
	background: #008cbc;
	text-align: center;
	padding: 1.2rem 1rem;
	color: #fff;
	font-size: 2rem;
}
.form-main {
	margin: 0 auto;
	padding: 1rem 0;
	max-width: 1000px;
	background: #fff;
	border-radius: 4px;
}
.form-item {
    margin: 1px auto;
    max-width: 900px;
    display: table;
    box-sizing: border-box;
    min-height: 100px;
    background: #c9e7f5;
    border-bottom: solid 1px #c6ddec; 
}
.form-item-smart {
    margin: 1px auto;
    max-width: 900px;
    display: table;
    box-sizing: border-box;
    min-height: 100px;
    background: #c9e7f5;
    border-bottom: solid 1px #c6ddec; 
}
.form-itemName {
    padding: 0 0 0 10px;
    width: 20rem;
    display: table-cell;
    box-sizing: border-box;
    vertical-align: middle;
}
.form-itemEntry {
    padding: 10px 20px 10px 30px;
    width: 80%;
    min-height: 62px;
    display: table-cell;
    box-sizing: border-box;
    vertical-align: middle;
    background: #FFF;
}
.product {
	width: 40%;
}
.plan {
	display: flex;
}
.coursePlan {
	padding-right: 6rem; 
}

.form-itemEntry.error {
	background:#FEFFC1;
}
.Applicant {
	color: #23ac38;
	border-bottom: solid 1px #c6ddec;
	text-align: center;
	padding: 6px 0;
	max-width: 900px;
	margin: 0 auto;
	background: #f2fff3;
}
input[type="text"],
input[type="tel"],
input[type="email"],
textarea {
	border:1px solid #7d7d7d;
	border-radius:2px;
	padding:9px 12px 8px;
	vertical-align:middle;
	font-size: 1.4rem;
	margin-bottom: 0.3rem;
}
textarea {
	width: 90%;
}
.input-userName {
    margin: 0 22px 0 15px;
    width: 230px;
}
.address-zip input {
    margin: 0 8px !important;
    width: 29%;
}
.address .must, .address-area .must {
    margin: 0 0 9px;
    display: block;
    font-weight: normal;
}
.address-area {
    padding: 8px 0 4px 0;
}
select {
    padding: 9px 25px 8px 12px;
    border: 1px solid #CCC;
    border-radius: 5px;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    background: url(https://plus-ins.co.jp/spiral/plus_form/img/select_arrow.png) no-repeat right center,linear-gradient(
180deg
,rgb(255,255,255) 0%,rgb(238,238,238) 100%);
    vertical-align: middle;
    width: 30%;
    font-size: medium;
}

.must {
	padding:0 0 0 46px;
	display:inline-block;
	background:url(https://plus-ins.co.jp/spiral/plus_form/img/icon_must.png) no-repeat left center;
}
.opt {
	padding:0 0 0 46px;
	display:inline-block;
	background:url(https://plus-ins.co.jp/spiral/plus_form/img/icon_opt.png) no-repeat left center;
}
input::placeholder {
    color: #cdcdcd;
}
.submitBtn {
	width: 70%;
	display: flex;
	justify-content: space-between;
	padding: 1rem;
	margin: 0 auto;
}
.submitBack {
	width: 34%;
	background: #535353;
    padding: 0.6rem 1rem;
    border-radius: 4px;
    text-align: center;
    }
    .submitGo {
    width: 34%;
	background: #23ac38;
    padding: 0.6rem 1rem;
    border-radius: 4px;
    text-align: center;
    }
input[type="submit"] {
	border: none;
	background: none;
	color: #fff;
    font-size: medium;
    font-weight: 600;
    cursor: pointer;
}
/*---------------------------------------
.terms
----------------------------------------*/
.terms {
	margin:25px 0;	
}
.terms-comment {
	margin:0 0 15px;
	font-size:110%;
	font-weight:bold;
	text-align:center;
}
.terms-scroll {
	margin:0 auto;
	padding:10px;
	border:1px solid #CCC;
	max-width:900px;
	height:240px;
	box-sizing:border-box;
	overflow-y:scroll;
	background: #f1f1f1;
	margin-top: 20px;
}

input[type="checkbox"] {
    width: 20px;
    height: 20px;
    vertical-align: bottom;
}
.button-attention {
	font-size: 1rem;
	max-width: 900px;
	margin: 0 auto;
	text-align: center;
}
.button {
	margin: 0 auto;
	text-align: center;
}
.button input {
	margin: 0.3rem 0 2rem;
	text-align: center;
	color: #fff;
	background: linear-gradient(#199814,#6cc54d);
	border-radius: 4px;
	border: none;
	width: 45%;
	padding: 0.4rem;
	box-shadow: 0px 2px 4px #7d7d7d;
    font-weight: 600;
    font-size: 1.8rem;
    cursor: pointer;
}
.underline-text {
  text-decoration: underline;
}
/*-----staff-----*/
.stafftext {
	margin: 4px 20px;
}
.staff {
	background: #cdcdcd;
	padding: 10px 20px;
	display: flex;
	justify-content: space-between;
}
.form-itemStaff {
    display: flex;
    justify-content: flex-start;
    width: 48%;
}
.form-itemNameStaff {
	padding: 10px;
	width: 28%;
}
.form-itemEntryStaff {
	padding: 10px;
	width: 64%;
	background: #fff;
}
input[type="radio"] {
	width: 18px;
	height: 18px;
	vertical-align: sub;
	margin-right: 10px;
}
/*---------------------*/
#footer {
	border-top: solid 1px #cdcdcd;
	background: #f7981d;
}
.footer-info {
	padding: 1rem;
	width: 80%;
	margin: 0 auto;
	color: #fff;
}
.footer-copy {
	padding: 0.5rem 0;
	background: #7d7d7d;
	color: #fff;
	text-align: center;
}
address {
	font-style: normal;
	color: #fff;
}
/*----thanks-----*/
.campaign {
	max-width: 1000px;
	background: #fff;
	margin: 0 auto;
}
.campaign p {
	text-align: center;
	padding-top: 1rem; 
}
.comment {
    margin: 0 auto 20px;
    max-width: 900px;
    min-height: 50px;
    box-sizing: border-box;
    text-align: center;
}
.comment b {
    font-size: 167%;
    font-weight: 700;
}
.phone {
    margin: 25px auto;
    padding: 20px;
    border-radius: 6px;
    background: #fff;
    overflow: hidden;
    width: 80%;
}
.phone p {
    margin: 0;
    padding: 10px;
    width: 100%;
    float: left;
    color: #333;
}
.phone-number {
    padding: 14px 0 12px;
    border: solid 1px;
    border-radius: 4px;
    width: 100%;
    min-height: 80px;
    box-sizing: border-box;
    float: right;
    background: #fff;
    text-align: center;
}
.phone-number div {
    margin: 0 0 5px;
    padding: 4px 0 0 38px;
    display: inline-block;
    box-sizing: border-box;
    background: url(https://plus-ins.co.jp/spiral/plus_form/img/icon_freedial_ll.png) no-repeat left center;
    color: #555;
    line-height: 1em;
    font-weight: 700;
    font-size: 221%;
}
/*---------------------------------------
TABLET
----------------------------------------*/
@media screen and (min-width: 480px) and (max-width: 1026px) {
	.pc-only {
    	display: none;
    }
    .sp-only {
    	display: inline-block;
    }
	.form-main {
		margin: 0 auto;
		padding: 1rem 0;
		max-width: 800px;
		background: #fff;
		border-radius: 4px;
	}
	.form-item {
    	margin: 0 auto;
    	max-width: 800px;
    	display: table;
    	box-sizing: border-box;
    	min-height: 70px;
    	background: #fff0da;
    	border-bottom: solid 1px #f7981d;
	}
	.form-item-smart {
	    margin: 1px auto;
    	max-width: 900px;
    	display: table;
    	box-sizing: border-box;
    	min-height: 100px;
    	background: #d2f5fe;
    	border-bottom: solid 1px #0073bc; 
	}
	.form-itemName {
   		padding: 0 0 0 10px;
    	display: table-cell;
    	box-sizing: border-box;
    	vertical-align: middle;
	}
	.form-itemEntry {
    	padding: 10px 15px;
    	border-radius: 3px;
    	width: 1000;
    	min-height: 62px;
    	display: table-cell;
    	box-sizing: border-box;
    	vertical-align: middle;
    	background: #FFF;
	}
	.terms-scroll {
		max-width:800px;
	}
/*------------------footer----------------*/
	#footer-cv {
		position: fixed;
		height: 100px;
	}
	.footer-r {
		display: none;
	}
	.footer-l {
		display: none;
	}
	.footer-c {
		max-width: 90%;
	}
	#page-top {
		margin: 0.7rem 0;
	}
	#page-top img {
		width: 8%;
		position: absolute;
		right: 1.4rem;
		bottom: 8rem;
	}
	.campaign img {
		width: 100%;
	}
}
/*---------------------------------------
SP
----------------------------------------*/
@media screen and (max-width: 480px){
	.pc-only {
    	display: none;
    }
    .sp-only {
    	display: block;
    }
	.header_content {
    	height: 70px;
    }
    .header_content li img {
    	padding: 0.6rem;
    }
    .msg {
	margin-left:10px;
	color:red;
	font-size: small;
	}
	ul {
		padding-left: 0;
	}
	.form-main {
		margin: 0 auto;
		padding: 0.2rem;
		max-width: 420px;
		background: #fff;
		border-radius: 4px;
	}
	.form-item {
    	margin: 1px auto;
    	max-width: 400px;
    	display: table;
    	box-sizing: border-box;
    	min-height: 70px;
    	background: #fff0da;
	}
	.form-item-smart {
	    margin: 1px auto;
    	max-width: 900px;
	    display: table;
	    box-sizing: border-box;
	    min-height: 100px;
	    background: #d2f5fe;
	    border-bottom: solid 1px #0073bc; 
	}
	.form-itemName {
    	display: table-cell;
    	box-sizing: border-box;
    	vertical-align: middle;
    	font-size: 0.8rem;
	}
	.form-itemEntry {
    	padding: 8px;
    	width: 1000;
    	min-height: 62px;
    	display: table-cell;
    	box-sizing: border-box;
    	vertical-align: middle;
    	background: #FFF;
	}
	.terms-scroll {
		max-width:700px;
		font-size: smaller;
		margin-top: 1rem;
	}
	.must {
		padding:20px 10px 0 0;
		display:inline-block;
		background:url(https://plus-ins.co.jp/spiral/plus_form/img/icon_must.png) no-repeat left center;
		font-weight:bold;
		background-position-y: top;
	}
	.address-must {
		padding:4px 0px 4px 40px;
		display:inline-block;
		background:url(https://plus-ins.co.jp/spiral/plus_form/img/icon_must.png) no-repeat left center;
	}
	.select-address {
		width: 80%;
	}
	input[type="text"],
	input[type="tel"],
	input[type="email"],
	input[type="number"],
	textarea {
		border:1px solid #CCC;
		border-radius:3px;
		padding:9px 12px 8px;
		box-shadow:inset 2px 1px 1px 0px rgba(0,0,0,0.2);
		vertical-align:middle;
		font-size: 1.2rem;
		margin-bottom: 0.3rem;
	}
	.input-userName {
    	margin: 0 5px 0 5px;
    	width: 200px;
	}
	input::placeholder {
    	color: #cdcdcd;
    	font-size: medium;
	}
	.button input {
		width: 90%;
	}
	.button-attention {
		font-size: 1rem;
		padding: 0 4px;
	}
	/*-----staff-----*/
.stafftext {
	margin: 4px 20px;
}
.staff {
	background: #cdcdcd;
	padding: 10px;
	display: flex;
	justify-content: space-between;
	flex-wrap: wrap;
}
.form-itemStaff {
    display: flex;
    justify-content: flex-start;
    width: 100%;
    margin: 6px 0;
}
.form-itemNameStaff {
	padding: 0;
	width: 30%;
	line-height: 70px;
}
.form-itemEntryStaff {
	padding: 10px;
	width: 70%;
	background: #fff;
}
input[type="radio"] {
	width: 18px;
	height: 18px;
	vertical-align: sub;
	margin-right: 10px;
}
/*---------------------*/
	.footer-info {
		width: 90%;
	}
	.footer-copy {
		font-size: smaller;
	}
	.submitBtn {
	width: 90%;
	display: flex;
	justify-content: space-between;
	padding: 0.4rem;
	margin: 0 auto;
	}
	.campaign img {
		width: 100%;
	}
}