@charset "utf-8";
/* CSS Document */

/* img_bnrMain.gif�̐ݒ� */
img[usemap] {
    max-width: 100%;
    height: auto;
}


/* ------------------------------------------------------------------
 * #content
 * --------------------------------------------------------------- */
#content .mt-10 {margin-top: 10px;}
#content .mt-20 {margin-top: 20px;}
#content .mt-30 {margin-top: 30px;}
#content .mb-10 {margin-bottom: 10px;}
#content .mb-20 {margin-bottom: 20px;}
#content .mb-30 {margin-bottom: 30px;}
#content .size-12 {font-size: 12px;}
#content .size-13 {font-size: 13px;}
#content .size-14 {font-size: 14px;}
#content .size-15 {font-size: 15px;}
h4 {line-height: 130px; margin: 0;}

/** ファイルドロップエリア */
#drop_area{
	width: 360px; 
	height: 130px;
	margin: 16px auto;
	border: dotted 4px #999;
	border-radius: 4px;
}
/** ファイルドロップエリア フォーカス時 */
#drop_area.focus {
	border-color: rgba(255, 121, 1, 1);
	background: rgba(255, 121, 1, 0.3);
}

/** 緑色の枠 */
.border_green{
	border: solid 3px ;
	border-color: rgb(63, 209, 0);
	border-radius: 8px;
}
.require:after {
content: "【必須】";
color : red;
}

/* モーダル「応募作品の取り扱いについて」 */
.modal label{
        font-weight: normal;
        font-size: large;
}
.modal-header {
        border-radius: 5px 5px 0 0;
}
.modal-footer {
        border-radius: 0 0 5px 5px;
}
.modal input[type=checkbox] {
        margin-right: 10px;
        width: 15px;
        height: 15px;
        transform: scale(1.4);
}
.modal ul{
	padding-left: 20px;
}
.modal li{
	margin: 0 30px 30px 30px;
    font-size: 16px;
}
.modal ul.detail{
	margin-top: 10px;
}
.modal ul.detail li{
	margin: 5px;
	list-style-type: decimal;
}
.modal button.btn-default {
	background-color: #D4D4D4;
}

#content {margin-top: 10px;}
#content .h3 {margin-top: 0;}
#content .row {box-sizing: content-box; margin: 0;}
#content .control-label {text-align: left;}
#content label.col-md-4 {padding-right: 0;}
@media screen and (max-width: 767px) {
    #content .h3 {font-size: 17px;}
    #content .col-md-11 {padding: 0;}
    #content .col-md-12 {padding: 0;}
    #content .control-label {text-align: left;}
    .modal-body ul {padding-left: 0;}
}
.modal-body {
    text-align: left;
}

/* 完了画面 */
#content div[id="thanks"] div {color: red; margin-top: 0; margin-bottom: 40px;}
#content .description {padding-right: 0; padding-left: 0; margin-bottom: 20px; font-size: 14px;}
#content .red {color: red;}

[v-cloak] {
    display: none;
}
#content input.readonly {pointer-events: none; user-select:none; border: none; box-shadow: none;}
#content input::placeholder {color: lightgrey;}
#content input::-ms-input-placeholder {color: lightgrey;} /* 旧Edge */
#content input:-ms-input-placeholder {color: lightgrey;}  /* IE */
#content input[type="number"]::-webkit-outer-spin-button,
#content input[type="number"]::-webkit-inner-spin-button {-webkit-appearance: none; margin: 0;}
#content input[type="number"] {-moz-appearance:textfield;}

/* モーダル「応募要項のご確認」 */
#job_description_modal ul {list-style: none; margin-bottom: 20px;}
#job_description_modal ul.inside {list-style: inside;}
#job_description_modal li {font-size: 16px; margin: 0 5px 5px 5px;}
#job_description_modal label {font-weight: normal; font-size: large; cursor: pointer;}
#job_description_modal .modal-header {background-color: blanchedalmond; border-radius: 5px 5px 0 0;}
#job_description_modal .modal-footer {background-color: blanchedalmond; border-radius: 0 0 5px 5px;}
#job_description_modal .modal input[type=checkbox] {margin-right: 10px; width: 15px; height: 15px; transform: scale(1.4);}

/* メディアクエリ */
@media screen and (max-width: 767px) {
	.modal li{font-size: 15px;}
	.modal li ul {margin-left: 15px}
	.modal li ul li {font-size: 12px;}
	#job_description_modal li {font-size: 12px;}
	#job_description_modal label {font-size: medium;}
}

#content div[class="continue_web_form"] {
	margin: 0 150px;
	padding: 8px 16px;
	border: solid 1px #ff0050;
	text-align: center;
	color: #ff0050;
	margin-bottom: 20px;
	font-weight: bold;
}

#content div[class="continue_web_form"]:hover {
	background-color: #ff0050;
	color: white;
	cursor: pointer;
}

#content div[class="continue_web_form"] a,
#content div[class="continue_web_form"] a:hover,
#content div[class="continue_web_form"] a:visited {
	color: inherit;
	text-decoration: none;
}