﻿@charset "utf-8";
/* CSS Document */

/* ==================================================================================================
　　共通
================================================================================================== */

html{font-size: 14px;}
body {-webkit-text-size-adjust: 100%;background-color: #EEF2F5}
#wrap{margin: 0 auto;overflow: hidden;}
input[type="submit"] {cursor: pointer;transition: 0.3s;}

.width_1200-max{width: 97%;max-width: 1200px;margin: 0 auto;box-sizing: border-box;}
.font_1dw{font-size: -webkit-calc(1rem - 1px);font-size: calc(1rem - 1px);}
.font_3dw{font-size: -webkit-calc(1rem - 3px);font-size: calc(1rem - 3px);}
.font_5dw{font-size: -webkit-calc(1rem - 5px);font-size: calc(1rem - 5px);}
.box_shadow_k{box-shadow: 0 1px 2px rgba(0,0,0,0.1)}
.hvr_line:hover{text-decoration: underline;}

#sp_nav1 li::before,#sp_nav3 li::before,#footer #bottom_menu li::before{
	content: '';
	position: absolute;
	display: inline-block;
}
main {min-height: calc(100vh - 375px);}

/*--- テーブル -------------*/
.contents table tr {
	background: #e8e8e8;
}
.contents table tr:nth-of-type(2n) {
	background: #fefefe;
}
.contents table tr th,.contents table tr td {
	padding: 15px 5px;
}
/*--- タブ切り替え -------------*/
.tab_list {

}
.tab_list li {
}
.tab_list li a {
	display: block;
	padding:15px 20px;
	border-radius: 10px 10px 0 0;
	text-align: center;
	margin-right: 5px;
	color:#fff;
}
.tab_list li a:hover {

}
/*--- ボタン -------------*/
.button {
	padding: 5px;
	font-size: 12px;
	color:#4d4d4d;
	background: #eee;
	border:1px solid #777;
	box-shadow: 1px 1px 1px #4d4d4d;
}
input[type="submit"]{
	font-family: "游ゴシック Medium", "游ゴシック体", "Yu Gothic Medium", YuGothic,"ヒラギノ角ゴ ProN", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS PGothic",  sans-serif;
	border: none;
}

/*--- モーダルボタン -------------*/
.modal_bt {
	cursor: pointer;
}
.modal_bg {
	top:0;
	left:0;
	background-color:rgba(0,0,0,0.8);
	z-index: 9;
}
.modal_box {
	max-height: 80%;
	overflow: auto;
	z-index: 10;
}
.close_bt {
	cursor:pointer;
}

/* ==================================================================================================
　クライアント出稿用新規追加スタイル
================================================================================================== */
/*--- 原稿作成画面用ボーダー -------------*/
.border_client {
	border: solid #003E8F;
	width: 700px;
}

/*--- 原稿作成画面用ラジオボタンブロック -------------*/
.radio_block{
	display: inline-block;
	white-space: nowrap;
}

/* ==================================================================================================
　check_box,radio,select,label
================================================================================================== */
/*--- input textarea -------------*/
input,textarea,select {
	border:2px solid #003E8F;
}
/*--- check_box -------------*/
.checkbox-input{
  display: none;
}
.checkbox-parts{
  padding-left: 25px;
  position:relative;
  margin-right: 20px;
}
.checkbox-parts::before{
  content: "";
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  width: 15px;
  height: 15px;
  border: 1px solid #003E8F;
}
.checkbox-input:checked + .checkbox-parts{
  color: #d01137;
}
.checkbox-input:checked + .checkbox-parts::after{
  content: "";
  display: block;
  position: absolute;
  top: -5px;
  left: 5px;
  width: 7px;
  height: 14px;
  transform: rotate(40deg);
  border-bottom: 3px solid #003E8F;
  border-right: 3px solid #003E8F;
}
/*--- radio -------------*/
.radio-input{
  display: none;
}
.radio-input + label{
  padding-left: 20px;
  position:relative;
  margin-right: 20px;
}
.radio-input + label::before{
  content: "";
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  width: 15px;
  height: 15px;
  border: 1px solid #003E8F;
  border-radius: 50%;
}
.radio-input:checked + label{
  color: #003E8F;
}
.radio-input:checked + label::after{
  content: "";
  display: block;
  position: absolute;
  top: 3px;
  left: 3px;
  width: 11px;
  height: 11px;
  background: #003E8F;
  border-radius: 50%;
}
/*--- select,label -------------*/


/*--- pager -------------*/
.pager ul li a{
	color:#142C4D;
	font-size:16px;
	margin: 10px;
	padding: 20px;
	background: #fff;
	display: block;
	border-bottom: 2px solid #003e8f;
}
.pager ul li a:hover{
	border-bottom: 2px solid #A2D827;
}
/* ==================================================================================================
　　header
================================================================================================== */
header {background: #fff;}
#header{z-index: 999;
}
#logo {
	padding-left: 10px;
}
#header #logo h1.logo{
	max-width: 250px;
	margin-left: 0;
}

/*--- header_title -------------*/

#sp_nav3{padding-top: 63px;}


/*--- header_nav -------------*/
#header_nav ul.all_page{margin-bottom: 0;}
#header_nav p a,
#header_nav li a{padding: 15px 0px 10px;}



/* ==================================================================================================
　　nav_menu
================================================================================================== */

.button_container {
	position: absolute;
	right: 20px;
	top: 0;
	bottom: 0;
	margin: auto;
	height: 19px;
	width: 23px;
	cursor: pointer;
	z-index: 9999;
	-webkit-transition: opacity .25s ease;
	transition: opacity .25s ease;
}
.button_container.active .top {
	-webkit-transform: translateY(7px) translateX(0) rotate(45deg);
	transform: translateY(7px) translateX(0) rotate(45deg);
	background: #666;
	width: 100%;
}
.button_container.active .middle {
	opacity: 0;
	background: #666;
}
.button_container.active .bottom {
	-webkit-transform: translateY(-10px) translateX(0) rotate(-45deg);
	transform: translateY(-10px) translateX(0) rotate(-45deg);
	background: #666;
	width: 100%;
}
.button_container span {
	background: #666;
	border: none;
	height: 2px;
	width: 100%;
	position: absolute;
	top: 0;
	right: 0;
	-webkit-transition: all .35s ease;
	transition: all .35s ease;
	cursor: pointer;
}
.button_container span:nth-of-type(2) {
	top: 8px;
	width: 100%;
	text-align: right;
}
.button_container span:nth-of-type(3) {
	top: 17px;
	width: 100%;
}
.overlay {
	position: fixed;
	background:rgba(255,255,255,0.97);
	top: 56px;
	right: 0;
	width: 100%;
	height: 0;
	opacity: 0;
	visibility: hidden;
	-webkit-transition: opacity .35s, visibility .35s, height .35s;
	transition: opacity .35s, visibility .35s, height .35s;
	overflow: hidden;
	z-index: 9998;
}
.overlay.open {
	opacity: 1.0;
	visibility: visible;
	/*padding-right: 50px;*/
	box-sizing: border-box;
	overflow: scroll;
	height: 100%;
}
.overlay nav {
	position: absolute;
	height: 100%;
	top: 54%;
	left: 0;
	right:0;
	margin: auto;
	-webkit-transform: translateY(-50%) translateX(0%);
	transform: translateY(-50%) translateX(0%);
	text-align: left;
	background: rgb(238,241,245);
    background: linear-gradient(180deg, rgba(238,241,245,1) 0%, rgba(0,62,143,1) 100%);
}
.overlay .menu-box {
	list-style: none;
	padding: 0;
	margin: auto;
	width: 90%;
	position: relative;
	height: 100%;
}
.overlay .menu-box .menu_list li {
	display: block;
	position: relative;
	opacity: 1;
}
.overlay .menu-box .menu_list li a {
	display: block;
	position: relative;
	text-decoration: none;
	overflow: hidden;
	padding: 13px 20px;

}
.overlay .menu-box .menu_list li a:hover:after, .overlay .menu-box .menu_list li a:focus:after, .overlay .menu-box .menu_list li a:active:after {
	width: 100%;
}
.overlay .menu-box .menu_list .tel_bt a{padding: 20px 0 22px;}



/* ==================================================================================================
　　page_base
================================================================================================== */

#page_base{
	position: relative;
	background-color: #EEF2F5;
	background-image: url("../images/gizagiza.svg"),url("../images/gizagiza2.svg");
	background-repeat: repeat-x;
	background-size: 30px;
	background-position: top,bottom;
}

.text-danger {
    color: #dc3545 !important;
}

a.text-danger:hover, a.text-danger:focus {
    color: #a71d2a !important;
}


/* ==================================================================================================
　　footer
================================================================================================== */

#footer{
	border-bottom: 20px solid #003e8e;
	background: #fff;
}
#footer #bottom_menu li::before {
    content: "|";
	top: 50%;
    left: 0;
	transform: translateY(-50%);
    color: #4d4d4d!important;
}
#footer #bottom_menu li:first-of-type::before{
	display: none;
}

/*--- top_return -------------*/
#page-top {
    position: fixed;
    bottom: 30px;
    right: 30px;
	z-index: 998;
}
#page-top a img{
	height: 50px;
	width: 50px;
}



/* ==================================================================================================
　IE
================================================================================================== */

@media all and (-ms-high-contrast: none){

}



/* ==================================================================================================
　1140px
================================================================================================== */

@media screen and (max-width: 1140px){

}


/* ==================================================================================================
　タブレット
================================================================================================== */

@media screen and (max-width: 768px){

/*--- header -------------*/
#header_title h2{
	margin-left: -133px;
}
#header_nav p a, #header_nav li a{padding: 10px 5px;}
#header_nav ul.all_page{margin-bottom: 0;}

/*--- 共通 -------------*/
#wrap{min-width: 100%;}
.width_95per_tb{width: 95%!important;min-width: 95%!important;}

/*　pan　*/
#pan .topicpath  li:before {font-size: 14px;padding:0 5px;}

/*--- テーブル -------------*/
.contents table tr {
	background: #fefefe;
	display: block;
	margin-bottom: 30px;
}
.contents table th {
	display: none;
}
/* セルをブロックとして表示 */
table td {
	display: block;
	border-bottom:1px solid #ccc;
}
table td:first-of-type {
	background: #ccc;
}
table td:empty {
	display:none;
}
}



/* ==================================================================================================
　スマートフォン
================================================================================================== */

@media screen and (max-width: 667px){

/*--- header -------------*/
#header {padding-bottom: 0; padding-top: 5px;}
	#header .h_box {margin-bottom: 0px;}
#header .h_left{width: 28%!important;}
#logo{position:
	relative;z-index: 99999;}
header.border_so10-t{border: none;}
#header{border-top: 7px solid #003E8F;box-shadow: 0 1px 2px rgba(0,0,0,0.1);}


/*--- footer -------------*/
#footer #bottom_menu li::before{display: none;}
#footer {border-bottom: 10px solid #003E8F;}


/*--- top_return -------------*/
#page-top {right: 15px;}
#page-top a img {height: 40px;width: 40px;}


/*--- 共通 -------------*/
.width_95per_sp{width: 95%!important;min-width: 95%!important;margin: auto;}
.font_1dw_sp{font-size: -webkit-calc(1rem - 1px)!important;font-size: calc(1rem - 1px)!important;}
.font_3dw_sp{font-size: -webkit-calc(1rem - 3px)!important;font-size: calc(1rem - 3px)!important;}
.border_da1-b_sp{border-bottom: 1px dashed;}
#pan .topicpath  li:before {font-size: 10px;padding:0 5px;}
#pan{padding: 10px 0;padding-top: 76px;}

/* 開閉ボタン */
#top_main .left .area span,#searches_Conditions .open_bt span{cursor: pointer;}
#top_main .left .area .arrow img,#searches_Conditions .arrow img{width: 15px;transform: rotate(90deg)
}

/* select,label */
#searches label::before,#searches_Conditions label.select_box::before {
    height: 5px;
    width: 5px;
    right: 8px;
    top: 12px;
}
}



