@charset "UTF-8";

/*
 * サイト共通用のCSSです。
 *
 */
@media only screen and (min-width: 768px) and (max-width: 1460px) {
  #main_image h1 {
  font-size: 45px;
}
	#main_image p {
    font-size: 17px;
}
}
@media only screen and (min-width: 768px) and (max-width: 1256px) {
#main_image {
    right: 14%;
    width: 60%;
	padding-top:8%;
}
}
@media only screen and (min-width: 768px) and (max-width: 1024px) {
  .pc {
    display: none;
  }

  .sp {
    display: block;
  }

  header {
    width: 97%;
  }

  .site-header {
    background: #fff;
    padding: 10px;
    position: absolute;
    width: 100%;
    height: 55px;
    z-index: 1;
  }


  /*ドロワーメニュー
----------------------------------------------- */
  .drawer_erea {
    display: block;
    position: fixed;
    z-index: 9998;
    background: #fff;
    width: 100%;
  }

  .drawer-nav {
    line-height: 35px;
    margin-right: 0px;
  }

  .drawer-nav ul li {
    margin-right: 0px;
    float: none;
  }

  .drawer-nav ul li:nth-child(7n) {
    margin-right: 0px;
    float: none;
  }

  .drawer-nav ul li:nth-child(8n) {
    margin-right: 0px;
    line-height: 35px;
  }

  .drawer-nav ul li:nth-child(9n) {
    margin-right: 0px;
    line-height: 35px;
  }

  .drawer-brand {
    line-height: 60px;
    line-height: 3.75rem;
    display: block;
    text-decoration: none;
    text-align: center;
  }

  .drawer-brand img {
    width: 60%;
  }

  .drawer-menu-item {
    font-size: 1pc;
    font-size: 1rem;
    display: block;
    padding: 9pt;
    padding: .75rem;
    text-decoration: none;
    color: #222;
  }

  .menut {
    position: fixed;
    left: 36px;
    top: 24px;
    font-size: 12px;
    font-weight: bold;
  }

  _::-webkit-full-page-media, _:future, :root .menut {
    position: fixed;
    left: 36px;
    top: 26px;
    font-size: 12px;
    font-weight: bold;
  }

  /* ===================================================================
	/
	/	smh_menu　トグルメニュー
	/
	=================================================================== */
  #smh_menu {
    display: block;
    position: relative;
    z-index: 9999;
  }

  .drawer-nav ul {
    background: #595757;
    padding: 0 10px;
  }

  .drawer-nav ul li {
    margin-right: 0px;
    float: none;
    display: block;
    padding: 0.2rem;
    text-decoration: none;
    color: #000;
    border-bottom: 1px solid #739ba2;
  }

  .drawer-nav ul ul.drawer_sub li a {
    color: #000;
  }

  body>header .h_r {
    display: none;
  }

  ul.drawer-menu_second {
    padding: 0;
    font: 14px/1.6 'arial narrow', sans-serif;
    list-style: none;
  }

  ul.drawer-menu_second li {
    position: relative;
    padding: 0.5em 1em 0.5em 2em;
    margin-bottom: 3px;
    font-size: 14px;
    font-weight: bold;
    color: #fff;
    background: #595757;
  }

  ul.drawer-menu_second li a:hover {
    color: #ccea24;
  }

  ul.drawer-menu_second li:last-child {
    border: none;
    margin: 0;
  }

  ul.drawer-menu_second li:before {
    font-family: 'Font Awesome 5 Free';
    font-weight: 900;
    content: '\f04b';
    position: absolute;
    left: 1.5em;
    color: #fff;
    font-size: 0.8em;
    /*font-weight: normal;*/
    top: 50%;
    -moz-transform: translateY(-50%);
    -webkit-transform: translateY(-50%);
    -o-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
  }

  ul.drawer-menu_second li a {
    color: #fff;
    padding: 0 0 0 10px;
  }

  #smh_menu {
    display: block;
  }

  #main_image h2 {
    font-size: 18px;
    line-height: 27px;
  }

  /*#main_image {
    padding-top: 17%;
  }*/

  #main_image h2 span {
    font-size: 10px;
    color: #718cb9;
  }
  #main_image p {
    font-size: 15px;
}
  section p {
    font-size: 12px;
    line-height: 21px;
    margin-bottom: 60px;
    letter-spacing: 0.5px;
    margin-top: 40px;
  }

  .t_service {
    width: 95%;
    padding: 70px 0 50px;
  }

  .t_service dl dt {
    text-align: center;
  }

  .t_topics {
    width: 95%;
    padding: 0 0 50px;
  }

  .kazari .wd40 {
    width: 100%;
    margin: 20px 0 40px;
  }

  footer .footer_container {
    width: 95%;
    margin: 30px auto;
  }

  footer dl dd {
    font-size: 0.71em;
  }

  footer .footer_container .f_l {
  }

  footer .copyright .container {
    width: 95%;
    margin: auto;
  }

  #page_top {
    bottom: 0;
  }
}

@media only screen and (max-width: 1024px) {
	.header_inner_l {
    width: 100px;
}
}


@media only screen and (max-width: 768px) {
	.pc {
    display: none;
  }

  .sp {
    display: block;
  }

  header {
    width: 97%;
  }

  .site-header {
    background: #fff;
    padding: 10px;
    position: absolute;
    width: 100%;
    height: 55px;
    z-index: 1;
  }


  /*ドロワーメニュー
----------------------------------------------- */
  .drawer_erea {
    display: block;
    position: fixed;
    z-index: 9998;
    background: #fff;
    width: 100%;
  }

  .drawer-nav {
    line-height: 35px;
    margin-right: 0px;
  }

  .drawer-nav ul li:nth-child(7n) {
    margin-right: 0px;
    float: none;
  }

  .drawer-nav ul li:nth-child(8n) {
    margin-right: 0px;
    line-height: 35px;
  }

  .drawer-nav ul li:nth-child(9n) {
    margin-right: 0px;
    line-height: 35px;
  }

  .drawer-brand {
    line-height: 60px;
    line-height: 3.75rem;
    display: block;
    text-decoration: none;
    text-align: center;
  }

  .drawer-brand img {
    width: 60%;
  }

  .drawer-menu-item {
    font-size: 1pc;
    font-size: 1rem;
    display: block;
    padding: 9pt;
    padding: .75rem;
    text-decoration: none;
    color: #222;
  }

  .menut {
    position: fixed;
    left: 36px;
    top: 24px;
    font-size: 12px;
    font-weight: bold;
  }

  _::-webkit-full-page-media, _:future, :root .menut {
    position: fixed;
    left: 36px;
    top: 26px;
    font-size: 12px;
    font-weight: bold;
  }

  /* ===================================================================
	/
	/	smh_menu　トグルメニュー
	/
	=================================================================== */
  #smh_menu {
    display: block;
    position: relative;
    z-index: 99999;
  }

  .drawer-nav ul {
    background: #595757;
    padding: 0 10px;
  }
  .drawer-nav ul ul {
    border-bottom: 1px solid #739ba2;
  }

  .drawer-nav ul li {
    margin-right: 0px;
    float: none;
    display: block;
    padding: 0.2rem;
    text-decoration: none;
    color: #000;
    border-bottom: 1px solid #739ba2;
  }

  .drawer-nav ul ul.drawer_sub li a {
    color: #000;
  }

  body>header .h_r {
    display: none;
  }

  ul.drawer-menu_second {
    padding: 0;
    font: 14px/1.6 'arial narrow', sans-serif;
    list-style: none;
  }

  ul.drawer-menu_second li {
    position: relative;
    padding: 0.5em 1em 0.5em 2em;
    margin-bottom: 3px;
    font-size: 14px;
    font-weight: bold;
    color: #fff;
    background: #595757;
  }

  ul.drawer-menu_second li a:hover {
    color: #ccea24;
  }

  ul.drawer-menu_second li:last-child {
    border: none;
    margin: 0;
  }

  ul.drawer-menu_second li:before {
    font-family: 'Font Awesome 5 Free';
    font-weight: 900;
    content: '\f04b';
    position: absolute;
    left: 1.5em;
    color: #fff;
    font-size: 0.8em;
    /*font-weight: normal;*/
    top: 50%;
    -moz-transform: translateY(-50%);
    -webkit-transform: translateY(-50%);
    -o-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
  }

  ul.drawer-menu_second li a {
    color: #fff;
    padding: 0 0 0 10px;
  }

  #main_image {
    width: 70%;
    text-align: center;
    right: 0;
	padding-top: 4%;
  }
  #main_image p {
    font-size: 18px;
    margin: 0 0 10px;
}
  #main_image h1 {
    font-size: 23px;
    line-height: 34px;
    width: 80%;
    margin: 0 auto 5%;
  }

  #main_image h2 {
    font-size: 12px;
    line-height: 20px;
	  letter-spacing: 1px;
  }

  section p {
    font-size: 12px;
    line-height: 21px;
    margin-bottom: 60px;
    letter-spacing: 0.5px;
    margin-top: 40px;
  }

  .kazari h2 {
    margin: 0 ;
    color: #595757;
    font-weight: 600;
  }

  .t_service {
    width: 95%;
		padding: 40px 0 40px;
  }

	.t_service .kazari img{
    width: 100%;
  }

  .t_service .kazari .flexbox{
    -webkit-box-orient: vertical;
  	-webkit-box-direction: normal;
  	-ms-flex-direction: column;
  	flex-direction: column;
  }

  .t_service .first_service {
    width: 90%;
    text-align: center;
    margin: 0 auto 50px;
  }

  .t_service .first_service h3 {
    font-size: 1.2em;
  }

  .t_service .first_service p {
    margin: 30px 0;
}

.t_service .second_service .second_service_l {
  margin-bottom: 40px;
	width: 100%;
}
.t_service .second_service .second_service_r {
  margin-bottom: 40px;
	width: 100%;
}
	.t_service .second_service .second_service_r02 {
  margin-bottom: 40px;
	width: 100%;
}


.t_service .second_service dl {
  width: 80%;
}

  .t_service dl dt {
    text-align: center;
  }

	.t_service dl dd {
    font-size: 0.9em;
		line-height: 2;
  }

	.t_topics {
    width: 95%;
    padding: 0 0 70px;
  }

  .t_topics .kazari .flexbox{
    -webkit-box-orient: vertical;
  	-webkit-box-direction: normal;
  	-ms-flex-direction: column;
  	flex-direction: column;
  }

	.t_topics .kazari ul li.title{
    text-align: justify;
	}

  .kazari .wd40 {
    width: 100%;
    margin: 20px 0 40px;
  }

  footer .footer_container {
    width: 95%;
    margin: auto;
    -webkit-box-orient: vertical;
  	-webkit-box-direction: reverse;
  	-ms-flex-direction: column-reverse;
  	flex-direction: column-reverse;
  }

  footer .footer_container .f_l {
    width: 100%;
  }

	footer .footer_container .f_l dl dt {
		text-align: center;
  }

	footer .footer_container .f_l dl dd {
		font-size: 0.8em;
	}

  footer .footer_container .f_r {
    width: 100%;
    margin-bottom: 40px;
  }

  footer .copyright .container {
    width: 95%;
    margin: auto;
		-webkit-box-orient: vertical;
  	-webkit-box-direction: reverse;
  	-ms-flex-direction: column-reverse;
  	flex-direction: column-reverse;
  }

	footer .copyright .container nav{
		width: 100%;
	}

	footer .copyright .container nav ul{
		width: 100%;
	}

  #page_top {
    bottom: 0;
  }
}

@media only screen and (max-width: 498px) {
	#main_image {
        width: 80%;
        text-align: center;
        right: 0;
        background: #00000066;
        padding: 13% 6% 0;
        margin: 10%;
    }
	    #main_image h1 {
        font-size: 17px;
        line-height: 30px;
    }
	#main_image p {
    font-size: 12px;
    line-height: 17px;
    }
}