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

/* ------------------------------------------------------------------------------
japan-izm.com
------------------------------------------------------------------------------ */

/*Font Size List ----------------------------------------------------------------
8px = 62%
9px = 70%
10px = 77%
11px = 85%
12px = 93%
13px = 100%
14px = 108%
15px = 116%
16px = 123.1%
17px = 131%
18px = 138.5%
19px = 146.5%
20px = 153.9%
21px = 161.6%
22px = 167%
23px = 174%
24px = 182%
25px = 189%
26px = 197%
------------------------------------------------------------------------------ */
html {
scroll-behavior: smooth;
}
img {
width:100%;
}
/* FontStyle */
strong {
font-weight: bold;
}
em {
font-style: italic;
}
/* LinkColor */
a:link {
color: #00F;
}
a:visited {
color: #600;
}
a:hover {
color: #090;
}
a:focus {
color: #090;
}
a:active {
color: #FF0;
}
/* TableStyle */
table {
border-top: 1px solid #CCC;
border-left: 1px solid #CCC;
border-collapse: collapse;
border-spacing: 0;
}
table th {
padding: 5px;
border-right: 1px solid #CCC;
border-bottom: 1px solid #CCC;
background: #CCC;
}
table td {
padding: 5px;
border-right: 1px solid #CCC;
border-bottom: 1px solid #CCC;
}
table thead {
word-spacing: normal;
}
table tfoot {
word-spacing: normal;
}
table tbody {
word-spacing: normal;
}
/* RoundBox */
.roundBox {
width: 500px;
background: url(none) repeat-y left top;
}
.roundCap {
font-size: 0%;
line-height: 0;
}
/* Note */
.note {
text-indent: -1em;
margin-left: 1em;
}
/*global*/
.header{
position: fixed;
left: 0;
top: 0;
width: 100%;
z-index:100;
background-color: rgba(255,255,255,0.8);
}
.header_inner {
padding: 15px;
}
.logo {
max-width: 120px;
min-width: 60px;
width: 10%;
}
.nav_list a,.footNavList li {
display:inline-block;
line-height:1.2;
}
.nav_list li a{
font-weight: bold;
}
.nav_list li a span {
font-weight:normal;
}
.nav_list li a,.footNavList li a {
text-decoration:none;
color:#000;
}
.nav_list li a:hover,.footNavList li a:hover {
opacity:0.5;
}
.nav_item.nav_abou a {
	background-color:#7C7C7C;
	color:#FFF;
}
.nav_item.nav_aya a {
	background-color:#FCECEC;
}
.nav_item.nav_kar a {
	background-color:#CF3080;
	color:#FFF;
}
.nav_item.nav_trad a {
	background-color:#D04D2F;
	color:#FFF;
}
.nav_item.nav_koji a {
	background-color:#FCFAE3;
}
.nav_item.nav_reno a {
	background-color:#829baa;
	color:#FFF;
}
.nav_item.nav_cont a {
	background-color:#F8F9F4;
}
.nav_item.nav_onli a {
	background-color:#A6A6A6;
}
.nav_item.nav_abou a,
.nav_item.nav_aya a,
.nav_item.nav_kar a,
.nav_item.nav_trad a,
.nav_item.nav_koji a,
.nav_item.nav_reno a,
.nav_item.nav_cont a,
.nav_item.nav_onli a {
	vertical-align: middle;
height: 72px;
display: table-cell;
padding: 0 12px;
min-width: 190px;
}
footer {
	padding-top:30px;
background-color:#F5F5F5;
}
.footNavBox{
display:flex;
margin-bottom:5px;
max-width: 900px;
margin-left: auto;
margin-right: auto;
justify-content: space-between;
align-items: center;
}
.footLogo{
	max-width:120px;
}
.footNavList {
display:-webkit-box;
display:-ms-flexbox;
display:flex;
justify-content: end;
-ms-flex-wrap: wrap;
    flex-wrap: wrap;
}
.footNavList li {
text-align: center;
padding:10px 20px;
}
.footLine {
max-width: 1200px;
margin-left: auto;
margin-right: auto;
}
.footAddBox{
display:flex;
margin-bottom:20px;
max-width: 900px;
margin-left: auto;
margin-right: auto;
justify-content: space-between;
}

.footAdd {
	text-align:left;
}
.footAddImg {
max-width: 200px;
margin-bottom:10px;
}

.footNsn{
display:flex;
justify-content: end;
}
.footNsn a:hover{
	opacity:0.5;
}
.footNsn div{
	max-width:100px;
	margin-left:20px;
}
.footNsn div:nth-child(1){
	display:none;
}

.footCopy {
padding-bottom:20px;
}
/*cont*/
.brandBg {
background-image:url(../img/brand.jpg);
background-repeat: no-repeat;
height:450px;
background-position: center;
background-size: cover;
margin-bottom:50px;
}
.brandBgTit.brandBg {
	text-align:center;
	position: relative;
}
.brandBgTit h2 {
	text-align:center;
	position: absolute;
	left: 50%;
  top: 50%;
  transform: translate(-50%,-50%);
  margin-bottom:0px;
  text-shadow: 5px 5px 8px #ffffff ,
-5px 5px 8px #ffffff ,
5px -5px 8px #ffffff ,
-5px -5px 8px #ffffff;
}
.topBtn {
position: fixed;
bottom: 10px;
right: 10px;
padding: 0.7em;
text-align: center;
-webkit-transition: 0.3s0;
-o-transition: 0.3s0;
transition: 0.3s0;
width:30px;
background-color: rgba(255,255,255,0.8);
}
.topBtn:hover {
opacity:0.7;
}

h2,h3,h4,.txt,.btn,p {
font-family:"A1明朝", "ＭＳ Ｐ明朝", "MS PMincho", "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", serif;
}
h2,h3,h4 {
font-weight:bold;
}
.txt {
font-size:123.1%;
text-align:justify;
}
.btn {
font-size:146.5%;
font-weight:bold;
}
.btn a {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-pack: space-evenly;
    -ms-flex-pack: space-evenly;
        justify-content: space-evenly;
-webkit-box-align: center;
    -ms-flex-align: center;
        align-items: center;
text-align: center;
text-decoration: none;
width: 180px;
padding: 10px 0px 10px 40px;
background: #ffffff;
color: #000;
border:2px solid #000;
position: relative;
}
.btn a:visited {
color: #000;
}
.btn a::after {
content: '';
width: 15px;
height: 15px;
border-top: 1px solid #000;
border-right: 1px solid #000;
-webkit-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
        transform: rotate(45deg);
}
.btn a:hover {
background: #000;
color: #fff;
}
.btn a:hover::after {
border-top: 1px solid #fff;
border-right: 1px solid #fff;
}
.titBox,.contFlex {
display:-webkit-box;
display:-ms-flexbox;
display:flex;
}
.titBox {
	max-width:1300px;
	padding:10px 0px;
	margin-left:auto;
	margin-right:auto;
	margin-bottom:70px;
}
.titBoxImg {
	max-width:150px;
	padding:10px 0px;
	margin-left:auto;
	margin-right:auto;
	margin-bottom: 20px;
}

.contFlex,.comContTxt {
	margin-bottom:70px;
}
.contFlexImg {
background-image:url(../img_common/dam.jpg);
background-size: cover;
background-repeat: no-repeat;
background-position: center;
}

.fade {
-webkit-transition: all 2000ms;
-o-transition: all 2000ms;
transition: all 2000ms;
opacity:0;
}
.fadeIn {
opacity: 1;
}
.comCont {
	max-width:1200px;
	margin-left:auto;
	margin-right:auto;
	padding-left: 20px;
padding-right: 20px;
margin-bottom:150px;
}

.probtn {
width: 300px;
margin-left:auto;
margin-right:auto;
margin-bottom:150px;
border:2px solid #000;
background: #ffffff;
}

.comContbtn a {
text-align: center;
text-decoration: none;
width: 100%;
padding-top:10px;
padding-bottom:10px;
display:inline-block;
color: #000;
border:1px #333333 solid;
font-size: 180%;
}
.comContbtn a:visited {
color: #000;
}
.comContbtn a:hover {
background: #000;
color: #fff;
}

/* ------------------------------------------------------------------------------
Template
------------------------------------------------------------------------------ */
@media screen and (min-width: 1070px) {
/* タブレット横+PC用 */
.spBr {
display:none;
}
#wrap {
width: 100%;
text-align: center;
}
#content {
max-width: 1600px;
margin-right: auto;
margin-left: auto;
text-align: left;
margin-top:185px;
scroll-margin-top: 220px;
padding-left:5px;
padding-right:5px;
}
/*global*/
.header_inner{
max-width: 1300px;
padding: 15px 30px;
margin-left: auto;
margin-right: auto;
display:-webkit-box;
display:-ms-flexbox;
display:flex;
-webkit-box-pack: justify;
    -ms-flex-pack: justify;
        justify-content: space-between;
align-items: center;
}
.logo {
}
.nav_list{
display:-webkit-box;
display:-ms-flexbox;
display:flex;
-webkit-box-pack: end;
    -ms-flex-pack: end;
        justify-content: end;
-ms-flex-wrap: wrap;
    flex-wrap: wrap;
align-items: center;
max-width: 980px;
width: 100%;
}
.nav_list li {
display: inline-block;
text-align: center;
/*padding:0px 2px;*/
}

/*cont*/
section {
/*margin-bottom:150px;*/
}
h2 {
font-size:250%;
/*text-indent:-1em;
margin-left:1em;*/
margin-bottom:50px;
}
h3 {
font-size:220%;
margin-bottom:10px;
}
h4 {
font-size:180%;
margin-bottom:10px;
}
.brandBgTit h2 {
  font-size:4rem;
  width: 100%;
}
.titBox,.contFlex {
-webkit-box-pack: justify;
    -ms-flex-pack: justify;
        justify-content: space-between;
}
.titBox {
align-items: center;
}
.titBoxTit {
width: 62%;
min-width:300px;
text-align: center;
}
.contFlexImg,.contFlexImgGr {
height:300px;
width:60%;
}
.contFlexImR {
-webkit-box-orient: horizontal;
-webkit-box-direction: normal;
    -ms-flex-direction: row;
        flex-direction: row;
}
.contFlexImR .contFlexTit {
margin-right:30px;
}
.contFlexImL {
-webkit-box-orient: horizontal;
-webkit-box-direction: reverse;
    -ms-flex-direction: row-reverse;
        flex-direction: row-reverse;
}
.contFlexImL .contFlexTit {
margin-left:70px;
}
.contFlexTit {
max-width: 450px;
}
.contFlex .txt {
margin-bottom:80px;
}
.contFlexTit .btn {
float:right;
}
}

@media screen and (max-width: 1069px)  {
/* スマートフォン縦用 */
.spBr {
display: block;
}
#wrap {
width: 100%;
text-align: center;
}
#content {
margin-right: auto;
margin-left: auto;
text-align: left;
margin-top:80px;
padding-left:10px;
padding-right:10px;
scroll-margin-top: 80px;
}
/*global*/
.header_inner {
padding: 5px;
display: block;
}
.logo {
max-width: 50px;
}
.nav {
position: fixed;
right: -320px; /* 右から出てくる */
top: 0;
width: 300px; /* スマホに収まるサイズ */
height: 100vh;
padding-top: 60px;
background-color: #fff;
-webkit-transition: all .6s;
-o-transition: all .6s;
transition: all .6s;
z-index: 200;
overflow-y: auto; /* メニューが多くなったらスクロールできるように */
}
.hamburger {
position: absolute;
right: 15px;
top: 8px;
width: 40px; /* クリックしやすい幅 */
height: 40px; /* クリックしやすい高さ */
cursor: pointer;
z-index: 300;
}
.nav_list {
margin: 0;
padding: 0;
list-style: none;
}
.nav_item {
text-align: center;
padding: 0 14px;
}
.nav_item a {
display: block;
padding: 8px 0;
border-bottom: 1px solid #eee;
text-decoration: none;
color: #333;
}
.nav_item a:hover {
background-color: #eee;
}
.hamburger_border {
position: absolute;
left: 11px;
width: 18px;
height: 2px;
background-color: #333;
-webkit-transition: all .6s;
-o-transition: all .6s;
transition: all .6s;
}
.hamburger_border_top {
top: 14px;
}
.hamburger_border_center {
top: 20px;
}
.hamburger_border_bottom {
top: 26px;
}
.black_bg {
position: fixed;
left: 0;
top: 0;
width: 100vw;
height: 100vh;
z-index: 100;
background-color: #333;
opacity: 0;
visibility: hidden;
-webkit-transition: all .6s;
-o-transition: all .6s;
transition: all .6s;
cursor: pointer;
}

/* 表示された時用のCSS */
.nav-open .nav {
right: 0;
}
.nav-open .black_bg {
opacity: .8;
visibility: visible;
}
.nav-open .hamburger_border_top {
-webkit-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
        transform: rotate(45deg);
top: 20px;
}
.nav-open .hamburger_border_center {
width: 0;
left: 50%;
}
.nav-open .hamburger_border_bottom {
-webkit-transform: rotate(-45deg);
    -ms-transform: rotate(-45deg);
        transform: rotate(-45deg);
top: 20px;
}
.nav_item.nav_abou a,
.nav_item.nav_aya a,
.nav_item.nav_kar a,
.nav_item.nav_trad a,
.nav_item.nav_koji a,
.nav_item.nav_reno a,
.nav_item.nav_cont a,
.nav_item.nav_onli a {
	width:26%;
}
.footNavList {
-webkit-box-orient:vertical;
-webkit-box-direction:normal;
    -ms-flex-direction:column;
        flex-direction:column;
}
.footLogo {
	margin-bottom:30px;
}
.footNavBox {
	flex-direction: column;
}
.footAddBox {
	flex-direction: column;
}
.footAddBox p {
	text-align:center;
}
.footAdd {
	margin-bottom:20px;
}
.footAddImg {
max-width: 200px;
margin-left:auto;
margin-right:auto;
}

.footNsn{
justify-content: center;
}
/*cont*/
.brandBg {
  height: 310px;
}
section {
margin-bottom:80px;
}
h2 {
font-size:200%;
/*text-indent:-1em;
margin-left:1em;*/
margin-bottom:30px;
}
h3 {
font-size:174%;
margin-bottom:10px;
}
h4 {
font-size:161.6%;
margin-bottom:10px;
}
.brandBgTit h2 {
  font-size:2.3rem;
  width: 100%;
}
.txt {
font-size:116%;
}
.btn {
font-size:130%;
float:right;
}
.btn a {
padding: 8px 0px 8px 40px;
}
.titBox,.contFlex {
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
    -ms-flex-direction: column;
        flex-direction: column;
}
.titBoxTit {
min-width:none;
text-align:center;
}
.titBoxTit h2 {
margin-bottom:0px;
}
.contFlexImg,.contFlexImgGr {
height: 220px;
width: 100%;
}
.contFlex .txt {
margin-bottom:20px;
}
.contFlex .btn {
margin-bottom:30px;
}
.comContbtn {
font-size:130%;
}
}