@charset "UTF-8";

/* CSS Document */
@media all and (min-width: 481px) and (max-width: 768px) {
}

@media all and (max-width: 768px) {
}

@media all and (max-width: 480px) {
}

@media all and (max-width: 768px) {
	#CONTAINER {
	border-top: 3px solid #5FD372;
	}
}
/*===============================================

HEADER

===============================================*/

@media all and (max-width: 768px) {
	#HEADER {
	width: auto;
	margin: 0;
	height: 47px;
	background:none;
}

h1 {display:none;}

.header_l {
	padding: 10px 0 0 10px;
}
.header_r {
	padding: 0 0 0 0;
}
.header_l img {width:78px;}


}


/*===============================================

NAVI-GLOBAL

===============================================*/


@media all and (max-width: 768px) {
	#GNAVI {display:none;}
}

/*===============================================

KEYVISUAL

===============================================*/
@media all and (max-width: 768px) {
#KEYVISUAL {
	max-width:640px;
}
}

/*===============================================

MAIN

===============================================*/
@media all and (max-width: 768px) {
#MAIN {
	width:auto;
		margin: 30px 10px 0 10px;
}
}

/*===============================================

PAGE

===============================================*/
@media all and (max-width: 768px) {
#PAGE {
	float:none;
	width:auto;
}
.experience_box {padding:10px;}
.form_experience_box {
	padding: 15px 10px;
}
}
@media all and (max-width: 480px) {
.parentBox {
	height: 260px;
}
.childBox {
	top: 11%;
	left: 23%;
	padding-right: 2%;
}

.infoList dt {
	float: none;
}
.infoList dd {
	float: none;
}

.comTable tr{
    display: block;
}
.comTable th,
.comTable td{
    display: list-item;
	list-style-type: none;
	width: inherit !important;
}
.comTable th {
	-webkit-border-radius: 8px 8px 1px 1px;
	-moz-border-radius: 8px 8px 1px 1px;
	border-radius: 8px 8px 1px 1px;
	padding: 10px 0;
}
.comTable td {
	-webkit-border-radius: 1px 1px 8px 8px;
	-moz-border-radius: 1px 1px 8px 8px;
	border-radius: 1px 1px 8px 8px;
}

.colStep > div {
	float: none;
	display: inherit;
	width: 100% !important;
	margin: 15px 0% 0% 0%;
}
.colStep > div img {
	width: 50%;
}

input[type="text"] {
	width: 100%;
}
textarea {
	height: 150px;
}
}
@media all and (min-width: 481px) and (max-width: 768px) {
.tb {
	display: inherit !important;
}
}
/*===============================================

SIDE

===============================================*/
@media all and (max-width: 619px) {
#SIDE {
	width:290px;
	float:none;
	margin:20px auto 0 auto;
}
}

@media all and (min-width: 620px) and (max-width: 768px) {
	#SIDE {width:600px;	margin:0 auto;float:none;}
	#side01 {float:left;width:290px;box-sizing:border-box;margin:20px 0 0 0;}
	#side02 {float:right;width:290px;box-sizing:border-box;}
}


/*===============================================

FOOTER

===============================================*/
@media all and (max-width: 768px) {
	.pagetop {width:auto;padding: 0 10px;}
#FOOTER {
	width:auto;
}
.footer_l {width:auto;float:none;}
.footer_r {display:none;}
}

/*===============================================

sp , pc

===============================================*/

@media all and (max-width:768px) {
.pc {
	display: none !important;
}
.sp {
	display: inherit !important;
}
}


/*------------------------------------------------- */
@media all and (max-width: 480px) {
	.col2 > div {float:none;width:auto;text-align:center;}
.column2 > div, .column2_37 > div, .column2_73 > div, .column2_46 > div, .column2_64 > div, .column3 > div {
	float: none;
	display: inherit;
	width: 100% !important;
	margin: 15px 0% 0% 0%;
}
.column4 > div > div {
	width: 48% !important;
}
.column4 > div {
	clear: both;
}
.column6 > div > div {
	width: 31.33% !important;
}
.column6 > div {
	clear: both;
}
}