@charset "UTF-8";

html{
	font-family: 'Kiwi Maru', serif;
}

html *{
	box-sizing: border-box;
}

/*アウトライン確認用
*{
	outline: 1px solid #ff0000;
} 
*/

body{
	margin-top: 0;
	margin-bottom: 0;
}

img{
	max-width: 100%;
	height: auto;
}

.wrapper{
	width: 98vw;
	text-align:center;
	margin-right: auto; margin-left: auto;
	margin-top: 0px;
	margin-bottom: 0px;
	text-align:left;
	background-color: #ffffff;
}

.logo img{
    width: 30%;
    float: left;
}
.logo a:link{
	text-decoration: none;
}

.header h1{
	font-weight: normal;
	float: left;
	font-size: 25px;
	color: #3f5170;
	margin: 10px 0 0 0;
	padding: 0 0 0 0;
}

h2{
	width: 40vw;
	color: #3f5170;
	font-size: 30px;
	border-bottom: 3px solid #3f5170;
	margin-top: 20px;
	margin-right: 0px;
	margin-bottom: 10px;
	margin-left: 0px;
	padding: 0 5px 0 5px;
}

h3{
	font-family: "Kokoro";
	color: #3f5170;
	font-size: 21px;
	border-bottom: 2px solid #3f5170;
	border-color: ##3f5170;
	margin-top: 0 0 20px 0;
	padding: 0 5px 0 5px;	
}

h4{
	font-weight: normal;
	display: inline;
}

h5{
	display: inline;
}

p{
    font-size: 21px;
    color: #000000;
	line-height: 1.6;
}

a:link{
	color: #d25833;
}
a:visited{
	color: #d25833;
}
a:hover{
	color: #e3937a;
}
a:active{
	color: #ff6a3b;
}

/* すべてのページに適用 -ヘッダー-ここから */

.header{
/*	position: fixed;	ヘッダーを固定する場合はオンにする(その際、mainにpaddingもいれること */
	background-color: #ffffff;

}

.header-index-background{
    height: 100px;
    background-image: url(../images/background-img6.png);
    background-repeat: repeat-x;
    background-position: bottom;
    background-size:30vw;
    
}
.logo {
	display: inline;
	margin: 0 0 4px 10px;
	
}

h5.header-index{
    font-family: "Kokoro";
    font-size:1.4vw;
    color:blue;
    display:inline;
    float:left;
    margin-top:20px;
    width: 26vw;
    border-bottom:none;
}
.header-side{
	float: right;
	margin-right: 50px;
}

.header-side li{
    font-size: 20px;
	list-style-type: none;
}

.header-side2{
	float:right;
	margin-right: 0px;
}

.header-side2 li{
    font-size: 20px;
	list-style-type: none;
}



.image_call{
	width: 1.5vw;
}
.image_mail{
	width: 1.5vw;
}

.header-index{
	font-family: "MS PGothic";
    font-size: 20px;
	border-bottom:solid 3px;
	border-color: #3f5170;
	color: #0000ff;
	float:right;
	width: 98vw;
	margin: -10px 0 5px 0;
}

.index_image_src{
}	

.keyvisual{
	clear: both;
	text-align: center;

}
.image_keyvisual{

	width: 100vw;
	height: auto;
	margin-top: -30px;
	padding-top: 0px;
}


/* ナビゲーション関連 ここから　*/
	
nav.nav{

	clear: both;
	display: block;
    text-align: center;
	margin-left:20px;
	padding: 0;

}

nav.nav li{
       
	display: inline-block;
	text-align: center;
	list-style-type: none;
	margin: 0;
	padding: 0px 0px;


}

nav.nav li h5{
	font-size: 21px;
	font-weight: normal;
	margin-bottom: 0px;
	padding-bottom: 0px;
	line-height: 0px;
}

nav.nav li p{
	font-size: 14px;
	color: #c0c0c0;
	margin: 0 0;
	padding: 0 0;
	line-height:10px;
}

nav.nav a{
	display: block;
	margin:0 0 5px 0;
	padding: 10px 40px; 10px 4  0px;
}

nav.nav a:link {
	color: #3c454d;
	text-decoration: none;
}
nav.nav a:visited {
	color: #3c454d;
	text-decoration: none;
}
nav.nav a:hover {
	color: #7b8dac;
	background-color: #ceedf5;
	text-decoration: none;
}
nav.nav a:active {
	color: #5a9bc0;
	text-decoration: none;
}

/* ナビゲーション関連 ここまで　*/

main{
	background-color: #ffffff;
	margin: 0 0px;
	padding: 0 10px;
}

/*　すべてのページに適応　- メイン - */

main{
	padding-top: 10px;
	border-radius: 30px 30px 30px 30px;
}


/* スマホ用イメージを消す ここから　*/
.image_keyvisual_s{
    display: none;
}
.koukoku_1_s{
        display: none !important; 
}
/* スマホ用イメージを消す　ここまで　*/
.koukoku_1{
        display: block !important;
        margin-top: 100px;
        margin-bottom: 150px;
}

.koukoku_2_s{
        display: none !important; 
}
/* スマホ用イメージを消す　ここまで　*/
.koukoku_2{
        display: block !important;
        margin-top: 100px;
        margin-bottom: 0px;
}

/* お問い合わせボタン */
.koukoku_call{
}
.koukoku_call_a{
    max-width: 70vw;
    display: block;
    margin: 0 auto;
}
/* すべてのページに適応 - フッター - */
.footer{
	background-color: #ffffff;
	
	
	padding: 90px 15px 20px 15px;
	margin-top:30px;
	font-size: 12px;
	color: #3f5170;
    height: 100px;
    background-image: url(../images/background-img6.png);
    background-repeat: repeat-x;
    background-position: bottom;
    background-size:50vw;
}

.footer p{
	margin:0px 10px 10px 10px;
	float:right;	
}

/* トップに適応　ここから */

.koukoku_call_a{
    width: 500px;
}

/* お知らせに適応　ここから　*/
main.news_main{
    background-image: url(../images/background_img4.png);
}
/* 会社概要に適応 ここから */
main.gaiyou_main{
	background-image: url(../images/background_img5.jpg);
	background-repeat: no-repeat;
    background-size: 70%;
}
.tb_gaiyou{
	font-size: 18px;
	margin: 30px 30px 30px 30px;
}

.tb_gaiyou p{
	margin: 5px 0px 5px 10px;
}

/* 事業内容に適用　ここから */

.contents_main{
   
    width: 50vw;
    margin-right: 10px;
}
.contents_main p{
    float: left;
    font-size: 20px;
}
.contents_img1{
    margin-left:10px;
    width: 40vw;
}


.contents_dummy{
    clear: both;
   
}

.contents_main2{
    float:left;
    width: 50vw;
    margin: 0;
    padding: 0;
}
.contents_img2{
    margin-left: 10px;
    width: 40vw;
}
.contents_dummy2{
    clear: both;
    
}

.contents_main3{
    float: left;
    width: 50vw;
}
.contents_img3{
    margin-left: 10px;
    width: 40vw;
}

/* 採用情報に適応　ここから */
.career_tb td{
    font-size: 20px;
    padding:10px;
    line-height:30px;
    border: solid 1px #3f5170;
    border-radius: 10px;
}
.career_tb{
    
    font-size: 18px;

}
/* アクセスに適応 ここから */
main.access_main{
	background-image: url(../images/background_img1.jpg);
	background-position:bottom;
	background-size:100%;
	background-repeat:norepeat;
}

.googlemap{
	margin:20px 0;
}

.tb_access{
    font-size: 20px;
}
.tb_access th{
	padding: 10px 5px 10px 0px;
}

.tb_access td{
	padding: 0px 0px 0px 5px;
}

/* お問い合わせ ここから */
main.contact_main{
	background-image: url(../images/background_img1.jpg);
	background-position:bottom;
	background-size:100%;
	background-repeat:norepeat;
}



.contact_img{
	width: 80px;
	margin: 0 0 -5px 0px;
}

.contact_index{
	font-weight: bold;
	font-size: 20px;
	margin-top:30px;
	margin-bottom: 0;
}
.contact_index p{
	font-size: 20px;
}

.contact_form{
	margin:10px 10px;
}
.contact_form dt{
    font-size: 21px;
	margin:10px 10px;
}

.contact_call {
	font-size: 25px;
	float: left;
	margin: 25px 10px 0 50px;
}

.contact_calling{
    font-size: 25px;
	color: #0000ff;
}
select[name="type"]{
    font-size: 21px;
    max-width: 100%;
    margin: 0 0 0 0;
}

.contact_submit{
	margin:-10px 0 0 40px;
	padding:0 0 30px 10px;
}

input[type="text"],input[type="email"]{
    max-width: 100%;
    border-radius: 5px;
    padding: 10px;
    font-size: 20px;
    }
textarea{
    border-radius: 5px;
    font-size: 20px;
}
    input[type="submit"]{
        font-size: 21px;    
}

/*　ここからスマホレスポンシブ設定
/* ここから下がハンバーガーメニューに関するCSS */
  
/* チェックボックスを非表示にする */

.drawer_hidden {
  display: none;
}

@media (max-width: 500px){
    .logo img{
    width: 90vw;
    
    }
    .header-index-background{
    background-size:200vw;
    
}
    body{
        max-width: 100%;
    }
    
    h5.header-index{
    display:none;
    }
    
    .logo img{
    margin-top: 14px;
    }
	.header h1{
	font-size: 20px;
	}
	h2{
	font-size:20px;
	}
	h5{
	font-size:20px;
	}	
	.header-side{
	display: none;
	}	
	.header-side2{
	display: none;
	}
	.header-index{
	margin-top :12px;
	font-size: 15px;
	}
	main{
	font-size:20px;
	}
	nav.nav{
	padding-top:50px;	
	}
	nav.nav li{
	display: inline;
	text-align: left;
	
	}
	nav.nav li h5{
	font-size: 15px;
	padding: 5px 10px;
	}

	nav.nav li p{
	font-size: 12px;
	padding: 0 10px;
	}
	/* ハンバーガーアイコンの設置スペース */
	.drawer_open {
	  display: flex;
	  height: 60px;
	  width: 60px;
	  justify-content: center;
	  align-items: center;
	  position: relative;	
	  z-index: 100;/* 重なり順を一番上にする */
	  cursor: pointer;
	}

	/* ハンバーガーメニューのアイコン */
	.drawer_open span,
	.drawer_open span:before,
	.drawer_open span:after {
	  content: '';
	  display: block;
	  height: 3px;
	  width: 25px;
	  border-radius: 3px;
	  background: #0000ff;
	  transition: 0.5s;
	  position: absolute;
	  margin-right: -10px;
	}

	/* 三本線の一番上の棒の位置調整 */
	.drawer_open span:before {
	  bottom: 8px;
	}

	/* 三本線の一番下の棒の位置調整 */
	.drawer_open span:after {
	  top: 8px;
	}

	/* アイコンがクリックされたら真ん中の線を透明にする */
	#drawer_input:checked ~ .drawer_open span {
	  background: rgba(255, 255, 255, 0);
	}

	/* アイコンがクリックされたらアイコンが×印になように上下の線を回転 */
	#drawer_input:checked ~ .drawer_open span::before {
	  bottom: 0;
	  transform: rotate(45deg);
	}

	#drawer_input:checked ~ .drawer_open span::after {
	  top: 0;
	  transform: rotate(-45deg);
	}
	  
	/* メニューのデザイン*/
	.nav {
	  width: 80%;
	  height: 100%;
	  position: fixed;
	  top: 0;
	  left: 100%; /* メニューを画面の外に飛ばす */
	  z-index: 99;
	  background: #fff;
	  transition: .5s;
	}

	/* メニュー黒ポチを消す */
	.nav_list {
      margin: -50px;
	  list-style: none;
	}

	/* アイコンがクリックされたらメニューを表示 */
	#drawer_input:checked ~ .nav{
	  left: 0;/* メニューを画面に入れる */
	}
    
    .image_keyvisual{
       
    }
     /* トップイメージの入れ替え開始 */
    .image_keyvisual{
        display: none !important;
    } 
    .image_keyvisual_s{
        display: block !important;
    }
    /* トップイメージの入れ替え終了 */
    
    /* 広告イメージの入れ替え開始 */
    .koukoku_1{
        display: none !important;
    } 
    .koukoku_1_s{
        display: block !important;
    }
    /* 広告イメージの入れ替え終了 */
        .koukoku_2{
        display: none !important;
    } 
    .koukoku_2_s{
        display: block !important;
    }
    /* お問い合わせボタン */
    .koukoku_call{
        
    }
    .koukoku_call_a{
    
    }
    
    /*事業内容 */
    
    .main_contents{
        margin-right: 10px;
    }
    .contents_main{
    clear: both;
    width: 90vw;
    padding-right: 10px;
    }
    .img_alldenka{
    width: 95vw;
    }
    .contents_main2{
    width: 90vw;
    }
    .contents_main3{
    width: 90vw;
    }

    
    /* お問い合わせ */

    label{
        font-size: 16px;
        margin: 0 0 0 -20px;
    }
    input[type="text"]{
        font-size: 15px;
        margin: 0 0 0 -50px;
        max-width: 80%;
    }
    input[type="email"]{
        font-size: 13px;
        margin: 0 0 0 -50px;
        max-width: 120%;
    }
    select[name="type"]{
        font-size: 15px;
        max-width: 100%;
        margin: 0 0 0 -50px;
    }
    textarea[name="content"]{
    max-width: 120%;
    margin: 0 0 0 -50px;
    }
    input[type="submit"]{
        font-size: 20px;
        width: 150px;
        margin: 10px 0 0 -50px;
    }
    /* すべてのページに適応 - フッター - */
.footer{
	
	margin:0;
	
    background-repeat: repeat-x;
    background-size: 200vw;
}

.footer p{
	font-size: 15px;
}

}
/* ここまでスマホレスポンシブ設定 */
