@charset "UTF-8";
@import url(http://fonts.googleapis.com/css?family=Open+Sans+Condensed:300,700);
@import url(https://fonts.googleapis.com/earlyaccess/mplus1p.css);
@import url(https://fonts.googleapis.com/earlyaccess/sawarabimincho.css);
@import url(https://fonts.googleapis.com/earlyaccess/roundedmplus1c.css);
@import url(https://fonts.googleapis.com/earlyaccess/kokoro.css);


/*============================
common
============================*/

strong {font-weight: bold;}

/*============================
layout
============================*/

html {
  height: 100%;
}

body {
	color: #333;
	font-size: 16px;
    font-family: serif
	/*font-family: 'Sawarabi Mincho','Open Sans','Mplus 1p','Hiragino Kaku Gothic ProN', 'ヒラギノ角ゴ ProN W3', 'Meiryo', 'メイリオ', 'Osaka', 'MS PGothic', arial, helvetica, sans-serif;*/
	margin: auto;
    height: auto;
	text-align: center;
	background: #fff;
}

/*a {
	color: #000000;
	text-decoration:  none;
}*/

small {
	font-size: 88%;
}

/*============================
haeder
============================*/

.header {
    /* Layout Properties */
    position: relative;
    width: 1280px;
    height: 853px;
    margin: auto;
    /* UI Properties */
    background: #aaa 0% 0% no-repeat padding-box;
    background-image: url(../img/index/asj_bb.jpg);
    background-size: cover;;
}

#header_menu {
    /* Layout Properties */
    position: absolute;
    top: 19px;
    left: 581px;
    padding: 20px;
    /* UI Properties */
    text-align: left;
    background: #FFFFFF 0% 0% no-repeat padding-box;
    box-shadow: 8px 8px 13px #00000029;
    border-radius: 6px;
}

#header_menu a {
    /* UI Properties */
    /* Layout Properties */
    top: 36px;
    left: 605px;
    width: 208px;
    height: 24px;
    margin: 0 10px;
    text-align: left;
    font: normal normal medium 16px/24px Noto Sans JP;
    font-weight: bold;
    text-decoration: none;
    letter-spacing: 0px;
    color: #5A5A5A;

}

.call {
    /* UI Properties */
    padding: 10px 30px;
    background: #C34300 0% 0% no-repeat padding-box;
    border-radius: 6px;
    color: #fff;
}

.call a {
    color: #fff;
}




/*============================
concon
============================*/

.concon {
        width: 1280px;
    margin: auto;
    padding: 120px 0 ;
}

.concon h2 {
    color:#C34300;
    text-align: left;
    font: normal normal medium 20px/29px Noto Sans JP;
    font-size: 28px;
}

.concon h3 {
    margin: 20px 0 0 0;
    text-align: left;
    font: normal normal medium 20px/29px Noto Sans JP;
    font-size: 42px;
    color: #393939;
}

.concon h4 {
    text-align: left;
    font: normal normal medium 20px/29px Noto Sans JP;
    font-size: 24px;
    color: #393939;
    border-left: solid 6px #C34300;
    margin-top: 60px;
    padding: 0 10px;
}


/*============================
about
============================*/

.about {    

}

.about_con {
    padding: 0 60px 0 120px ;
}

.about p {
    margin: 42px 0 0 0;
    text-align: left;
    font: normal normal normal 18px/39px Noto Sans JP;
    letter-spacing: 0px;
    color: #1C1C1C;
    font-size: 21px;
}

/*============================
service
============================*/

.service {    

}

.service_con {
    padding: 0;
}

.service p {
    margin: 42px 0 0 0;
    text-align: left;
    font: normal normal normal 18px/39px Noto Sans JP;
    letter-spacing: 0px;
    color: #1C1C1C;
    font-size: 21px;
}

.service_title {
    width: 100%;
    text-align: center;
    margin: auto;
    font-size: 42px;
    padding: 40px
}

.service_check {
    width: 640px;
    margin: 40px auto;
    padding: 20px;
    font-size: 28px;
    color: #fff;
    background: #C34300 0% 0% no-repeat padding-box;
    box-shadow: 5px 5px 0px #FFCBB1;
    border-radius: 3px;
}


.service_check a {
    width: 640px;
    display: block;
    text-decoration: none;
    color: #fff;
}

/*============================
asj_footer
============================*/


.asj_footer {
    width: 100%;
    background: #F4F4F4 0% 0% no-repeat padding-box;
}


.asj_footer_con {
    width: 1280px;
    margin: auto;
}


.footer_link {
    text-align: right;
    margin: 0px auto;
    padding: 60px 0 0 60px;
}

.footer_link li {
    margin: 30px auto;
}

.footer_link a {
    text-decoration: none;
    color: #1C1C1C;
    font-size: 21px;
    font-weight: bold;
    font: normal normal normal 16px/24px Noto Sans JP;
}


/*============================
flexbox
============================*/

.flex_w {
	display: -webkit-flex;
	display: flex;
	width: 100%;
}

.flex_wc {
	display: -webkit-flex;
	display: flex;

}

.flex1 {
	-webkit-flex: 1;
	flex: 1;
}

.flex2 {
	-webkit-flex: 2;
	flex: 2;
}

.flex3 {
	-webkit-flex: 3;
	flex: 3;
}

.flex4 {
	-webkit-flex: 4;
	flex: 4;
}

.flex5 {
	-webkit-flex: 5;
	flex: 5;
}

.flex6 {
	-webkit-flex: 6;
	flex: 6;
}

.flex7 {
	-webkit-flex: 7;
	flex: 7;
}

.flex8 {
	-webkit-flex: 8;
	flex: 8;
}

.flex9 {
	-webkit-flex: 9;
	flex: 9;
}

.flex10 {
	-webkit-flex: 10;
	flex: 10;
}

/*============================
ul
============================*/

ol{  
	width: 100%;
	padding: 0.3em;
	padding-left: 2em;
	list-style-type: circle
}

ul {
    
}

li{
	text-align: left;
	margin: 3px;
}

/*============================
dl 
============================*/

dl{
 
}

dt{
  font-size: 18px;
  padding: 0.5em;
  padding-top: 1em;
  width : 4.5em;
  text-align: left;
  float : left;/* 左に寄せる */
  clear : both;/* フロートの解除 */
  line-height: 0;
    font-weight: bold;
    color: #1C1C1C;
    font: normal normal normal 16px/24px Noto Sans JP;
}

dd {
  font-size: 18px;
  padding: 0.5em;
  padding-top: 1em;
  padding-left: 5em;
  text-align: left;
  margin-left : 1.5em;/* DTの幅分の設定 */
  line-height: 180%;
font-weight: bold;
    color: #1C1C1C;
    font: normal normal normal 16px/24px Noto Sans JP;
}

/*============================
photo
============================*/

.photo_r {
    position: relative;
}

.photo {
	margin: 20px 0;
	position: absolute;
	display: inline-block;
	width: 280px;
	height: 186px;
	border: 3px solid #fff;
	box-shadow: 0 0 4px #999;
	transform: rotate(5deg); /* 全体を回転 */
	overflow: hidden; /* 不要部分は消す */
	box-shadow:5px 5px 10px 1px #000000;
	-moz-box-shadow:5px 5px 10px 1px #000000;
	-webkit-box-shadow:5px 5px 10px 1px #000000;
	bottom: 20px;
	right: 20px;
    z-index: 999;
}
.photo img {
	margin-top: 0;
	margin-left: -30px; /* ポジション調整 */
	transform-origin: 0 0;
}

.photo_2nd {
	margin: 20px 0;
	position: absolute;
	display: inline-block;
	width: 280px;
	height: 186px;
	border: 3px solid #fff;
	box-shadow: 0 0 4px #999;
	transform: rotate(-5deg); /* 全体を回転 */
	overflow: hidden; /* 不要部分は消す */
	box-shadow:5px 5px 10px 1px #000000;
	-moz-box-shadow:5px 5px 10px 1px #000000;
	-webkit-box-shadow:5px 5px 10px 1px #000000;
	bottom: 20px;
	right: 20px;
}

.photo_2nd img {
	margin-top: 0;
	margin-left: -30px; /* ポジション調整 */
	transform-origin: 0 0;
}

.photo120 {
	margin: 20px 0;
	position: absolute;
	display: inline-block;
	width: 120px;
	height: 80px;
	border: 3px solid #fff;
	box-shadow: 0 0 4px #999;
	transform: rotate(5deg); /* 全体を回転 */
	overflow: hidden; /* 不要部分は消す */
	box-shadow:5px 5px 10px 1px #000000;
	-moz-box-shadow:5px 5px 10px 1px #000000;
	-webkit-box-shadow:5px 5px 10px 1px #000000;
	bottom: 0px;
	right: 60px;
}

.photo180 {
	margin: 20px 0;
	position: absolute;
	display: inline-block;
	width: 180px;
	height: 120px;
	border: 3px solid #fff;
	box-shadow: 0 0 4px #999;
	transform: rotate(5deg); /* 全体を回転 */
	overflow: hidden; /* 不要部分は消す */
	box-shadow:5px 5px 10px 1px #000000;
	-moz-box-shadow:5px 5px 10px 1px #000000;
	-webkit-box-shadow:5px 5px 10px 1px #000000;
	top: 0px;
	right: 60px;
}

/*============================
Footer
============================*/

footer {
	width: 100%;
	text-align: center;
	margin: 0 auto;
	background: #454968;
	color: #4da619;
	border-bottom: 1px solid #cccccc;
	border-top: 1px solid #cccccc;
}

footer .footer_c {
	margin: auto;
	padding-top: 0.3em;
	padding-bottom: 0.3em;
}

footer .footer_c a {

	color: #fafafa;

}

footer .footer_c_div_w {

	border: 1px solid #afb0be;

}

.footer_chiharuya {
	width: 100%;
	text-align:center;
	margin:0 auto;
	padding: 5px 0;
	font-size: 15px;
	background: #eaeaea;
	border-top: 1px solid #aaa;
}

.footer_chiharuya a{
	color: #333;
    text-decoration: none;
}

.footer_chiharuya a:hover{
	color: gold;
	text-decoration: underline;
}

.copyright{
	margin: 0 auto;
	padding: 5px 0;
	text-align: center;
	color: #333;
}

.copyright a{
	color: #3a3a3a;
}

.copyright a:hover{
	color: gold;
	text-decoration: none;
}

/* footer button end */

.padding_left_10 {
	padding-left: 10px;
}

.float_left {
	float: left;
}
.clear {
	clear: both;
}

