/*
Template Name: Bootstrap 
Author:  
Author URI:
Version: 1.0

====/========        ===== ==/====/
             CSS Index
====/========        =======/====/

01. Common Css
02. Section Title CSS
03. Header Area CSS
04. Slider Area CSS
05. Slider Area CSS
06. Parallax Area CSS
07. Service Area CSS
08. Advertisement Area CSS
09. Portfolio Area CSS
10. Team Area CSS
11. Counter Up Area CSS
12. Price Area CSS
13. Testimonial Area CSS
14. Blog Area CSS
15. Contact Area CSS
16. Footer Area CSS

*/

/*
* ----------------------------------------------------
*   01. Reset CSS 
* ----------------------------------------------------
*/

body, html{
	height:100%;
    scroll-behavior: smooth;
}
.alignleft {
    float: left;
    margin-right: 15px;
}
.alignright {
    float: right;
    margin-left: 15px;
}
.aligncenter {
    display: block;
    margin: 0 auto 15px;
}
img {
    max-width: 100%;
    height: auto;
}
h1,
h2,
h3,
h4,
h5,
h6 {
    margin: 0 0 15px;
    color: #373737;
    font-weight: 400;
    line-height: 1.3
 }
 p{
	 color:#373737
 }

body { 
	font-family: 'Montserrat', sans-serif;
    font-size: 14px;
    color: #000;
    line-height: 1.8
}
a {
    color: #064AAF;
    text-decoration: none;
    background-color: transparent;
}
a:hover { 
    text-decoration: none;
}
a:focus, input:focus, textarea:focus, button:focus { 
    outline: 0 solid;
    text-decoration: none;
}
@media (max-width: 575.98px) {
}

@media (min-width: 576px) and (max-width: 767.98px) {
}

@media (min-width: 768px) and (max-width: 991.98px) {
}

@media (min-width: 992px) and (max-width: 1199.98px) {
}

@media (min-width: 1200px) {
}
@media screen and (min-width: 768px) {

  a[href^="tel:"] {
    pointer-events: none;
  }

}
/*
* ----------------------------------------------------
*   02. Common Css 
* ----------------------------------------------------
*/


body {
  font-family: "Open Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
  background-color: #fff;
  /*height: 200vh;*/
  position: relative; }
  body:before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(0, 0, 0, 0.5);
    -webkit-transition: .3s all ease;
    -o-transition: .3s all ease;
    transition: .3s all ease;
    opacity: 0;
    visibility: hidden;
    z-index: 1; }
  body.offcanvas-menu:before {
    opacity: 1;
    z-index: 1002;
    visibility: visible; }

p {
  color: #413F3F;
  font-weight: 400; }

h1, h2, h3, h4, h5, h6,
.h1, .h2, .h3, .h4, .h5, .h6 {
  font-family: "Open Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji"; }

a {
  -webkit-transition: .3s all ease;
  -o-transition: .3s all ease;
  transition: .3s all ease; }
  a, a:hover {
    text-decoration: none !important; }

/*
* ----------------------------------------------------
*   03. Section Title CSS
* ----------------------------------------------------
*/

section {
	padding:80px 0;
}
section.no-gut {
	padding:0px 0!important;
}

.section-title {
  text-align: center;
  margin: 80px 0;
}
.section-title h4 {
	position: relative;
	display: inline-block;
	padding-bottom: 10px;
}
.section-title h4:before {
  position: absolute;
  content: "";
  width: 180px;
  height: 3px;
  background-color: #000;
  bottom: 0;
  left: 50%;
  margin-left: -90px;
}
.section-title h4:after {
	position: absolute;
	content: "";
	width: 140px;
	height: 2px;
	background-color: #CD0404;
	left: 50%;
	bottom: -8px;
	margin-left: -70px;
}


dl .my-6 dt,dd {
	border-bottom: dotted 1px #C8C6C6;

}
@media (max-width: 575.98px) {
	section {
	padding:20px 0;
}
	.section-title {
  margin: 20px 0;
}
}
/*
* ----------------------------------------------------
*   04. Header Area CSS
* ----------------------------------------------------
*/
header {
border-top:solid 3px #c30d23;}


.top-bar {
  padding: .4rem 0 .4rem 0;
	background-color: #000000;
}
  .top-bar a {
    color: #fff; }
header h1 {
	font-size: 1.45rem;
	margin-left: -1.4rem;
}
.sns {
	font-size: 2.4rem;
	margin-top: .3rem;
}
.site-navbar .logo{
	width: 60%;
	height: auto;
}
@media (max-width: 991.98px) {
.mb {
	font-size: 3.0rem;
}
	.sns {
	font-size: 3.0rem;
	margin-top:0rem;
	display: block;
	height: 3.0rem;
}
	
.site-navbar .logo{
	width: 45%;
	height: auto;
}
	
.site-navbar {
  padding: .5rem!important;
	}



}

.site-navbar {
  margin-bottom: 0px;
  z-index: 1999;
  position: relative;
  width: 100%;
  padding: 1rem; }
  @media (max-width: 991.98px) {
    .site-navbar {
      padding-top: .5rem;
      padding-bottom: .5rem; } }
  .site-navbar .toggle-button {
	  
    position: absolute;
    right: 0px; }
  .site-navbar .site-logo {
    position: absolute;
    font-size: 2rem;
    text-transform: uppercase;
    font-weight: 900;
    line-height: 0;
    margin: 0;
    padding: 0;
    z-index: 3; }
    @media (max-width: 991.98px) {
      .site-navbar .site-logo {
        float: left;
        position: relative; } }
  .site-navbar .site-navigation.border-bottom {
    border-bottom: 1px solid white !important; }
  .site-navbar .site-navigation .site-menu {
    margin-bottom: 0; }
    .site-navbar .site-navigation .site-menu .active {
      color: #007bff !important; }
    .site-navbar .site-navigation .site-menu a {
      text-decoration: none !important;
      display: inline-block; }
    .site-navbar .site-navigation .site-menu > li {
      display: inline-block; }
      .site-navbar .site-navigation .site-menu > li > a {
        margin-left: 15px;
        margin-right: 15px;
        padding: 20px 0px;
        color: #000 !important;
        display: inline-block;
        text-decoration: none !important; }
        .site-navbar .site-navigation .site-menu > li > a:hover {
          color: #007bff; }
    .site-navbar .site-navigation .site-menu .has-children {
      position: relative; }
      .site-navbar .site-navigation .site-menu .has-children > a {
        position: relative;
        padding-right: 20px; }
        .site-navbar .site-navigation .site-menu .has-children > a:before {
          position: absolute;
          content: "\e313";
          font-size: 16px;
          top: 50%;
          right: 0;
          -webkit-transform: translateY(-50%);
          -ms-transform: translateY(-50%);
          transform: translateY(-50%);
          font-family: 'icomoon'; }
      .site-navbar .site-navigation .site-menu .has-children .dropdown {
        visibility: hidden;
        opacity: 0;
        top: 100%;
        position: absolute;
        text-align: left;
        border-top: 2px solid #c30d23;
        -webkit-box-shadow: 0 2px 10px -2px rgba(0, 0, 0, 0.1);
        box-shadow: 0 2px 10px -2px rgba(0, 0, 0, 0.1);
        padding: 0px 0;
        margin-top: 20px;
        margin-left: 0px;
        background: #fff;
        -webkit-transition: 0.2s 0s;
        -o-transition: 0.2s 0s;
        transition: 0.2s 0s; }
        .site-navbar .site-navigation .site-menu .has-children .dropdown.arrow-top {
          position: absolute; }
          .site-navbar .site-navigation .site-menu .has-children .dropdown.arrow-top:before {
            display: none;
            bottom: 100%;
            left: 20%;
            border: solid transparent;
            content: " ";
            height: 0;
            width: 0;
            position: absolute;
            pointer-events: none; }
          .site-navbar .site-navigation .site-menu .has-children .dropdown.arrow-top:before {
            border-color: rgba(136, 183, 213, 0);
            border-bottom-color: #fff;
            border-width: 10px;
            margin-left: -10px; }
        .site-navbar .site-navigation .site-menu .has-children .dropdown a {
          text-transform: none;
          letter-spacing: normal;
          -webkit-transition: 0s all;
          -o-transition: 0s all;
          transition: 0s all;
          color: #000 !important; }
          .site-navbar .site-navigation .site-menu .has-children .dropdown a.active {
            color: #007bff !important;
            background: #f8f9fa; }
        .site-navbar .site-navigation .site-menu .has-children .dropdown > li {
          list-style: none;
          padding: 0;
          margin: 0;
          min-width: 200px; }
          .site-navbar .site-navigation .site-menu .has-children .dropdown > li > a {
            padding: 9px 20px;
            display: block; }
            .site-navbar .site-navigation .site-menu .has-children .dropdown > li > a:hover {
              background: #f8f9fa;
              color: #ced4da; }
          .site-navbar .site-navigation .site-menu .has-children .dropdown > li.has-children > a:before {
            content: "\e315";
            right: 20px; }
          .site-navbar .site-navigation .site-menu .has-children .dropdown > li.has-children > .dropdown, .site-navbar .site-navigation .site-menu .has-children .dropdown > li.has-children > ul {
            left: 100%;
            top: 0; }
          .site-navbar .site-navigation .site-menu .has-children .dropdown > li.has-children:hover > a, .site-navbar .site-navigation .site-menu .has-children .dropdown > li.has-children:active > a, .site-navbar .site-navigation .site-menu .has-children .dropdown > li.has-children:focus > a {
            background: #f8f9fa;
            color: #ced4da; }
      .site-navbar .site-navigation .site-menu .has-children:hover > a, .site-navbar .site-navigation .site-menu .has-children:focus > a, .site-navbar .site-navigation .site-menu .has-children:active > a {
        color: #007bff; }
      .site-navbar .site-navigation .site-menu .has-children:hover, .site-navbar .site-navigation .site-menu .has-children:focus, .site-navbar .site-navigation .site-menu .has-children:active {
        cursor: pointer; }
        .site-navbar .site-navigation .site-menu .has-children:hover > .dropdown, .site-navbar .site-navigation .site-menu .has-children:focus > .dropdown, .site-navbar .site-navigation .site-menu .has-children:active > .dropdown {
          -webkit-transition-delay: 0s;
          -o-transition-delay: 0s;
          transition-delay: 0s;
          margin-top: 0px;
          visibility: visible;
          opacity: 1; }

.site-mobile-menu {
  width: 300px;
  position: fixed;
  right: 0;
  z-index: 2000;
  padding-top: 20px;
  background: #fff;
  height: calc(100vh);
  -webkit-transform: translateX(110%);
  -ms-transform: translateX(110%);
  transform: translateX(110%);
  -webkit-box-shadow: -10px 0 20px -10px rgba(0, 0, 0, 0.1);
  box-shadow: -10px 0 20px -10px rgba(0, 0, 0, 0.1);
  -webkit-transition: .3s all ease-in-out;
  -o-transition: .3s all ease-in-out;
  transition: .3s all ease-in-out; }
  .offcanvas-menu .site-mobile-menu {
    -webkit-transform: translateX(0%);
    -ms-transform: translateX(0%);
    transform: translateX(0%); }
  .site-mobile-menu .site-mobile-menu-header {
    width: 100%;
    float: left;
    padding-left: 20px;
    padding-right: 20px; }
    .site-mobile-menu .site-mobile-menu-header .site-mobile-menu-close {
      float: right;
      margin-top: 8px; }
      .site-mobile-menu .site-mobile-menu-header .site-mobile-menu-close span {
        font-size: 30px;
        display: inline-block;
        padding-left: 10px;
        padding-right: 0px;
        line-height: 1;
        cursor: pointer;
        -webkit-transition: .3s all ease;
        -o-transition: .3s all ease;
        transition: .3s all ease; }
        .site-mobile-menu .site-mobile-menu-header .site-mobile-menu-close span:hover {
          color: #ced4da; }
    .site-mobile-menu .site-mobile-menu-header .site-mobile-menu-logo {
      float: left;
      margin-top: 10px;
      margin-left: 0px; }
      .site-mobile-menu .site-mobile-menu-header .site-mobile-menu-logo a {
        display: inline-block;
        text-transform: uppercase; }
        .site-mobile-menu .site-mobile-menu-header .site-mobile-menu-logo a img {
          max-width: 70px; }
        .site-mobile-menu .site-mobile-menu-header .site-mobile-menu-logo a:hover {
          text-decoration: none; }
  .site-mobile-menu .site-mobile-menu-body {
    overflow-y: scroll;
    -webkit-overflow-scrolling: touch;
    position: relative;
    padding: 0 20px 20px 20px;
    height: calc(100vh - 52px);
    padding-bottom: 150px; }
  .site-mobile-menu .site-nav-wrap {
	  
    padding: 0;
    margin: 0;
    list-style: none;
    position: relative; }
    .site-mobile-menu .site-nav-wrap a {
      padding: 10px 20px;
      display: block;
      position: relative;
      color: #212529; }
      .site-mobile-menu .site-nav-wrap a:hover {
        color: #007bff; }
    .site-mobile-menu .site-nav-wrap li {
      position: relative;
      display: block; }
      .site-mobile-menu .site-nav-wrap li .nav-link.active {
        color: #007bff; }
    .site-mobile-menu .site-nav-wrap .arrow-collapse {
      position: absolute;
      right: 0px;
      top: 10px;
      z-index: 20;
      width: 36px;
      height: 36px;
      text-align: center;
      cursor: pointer;
      border-radius: 50%; }
      .site-mobile-menu .site-nav-wrap .arrow-collapse:hover {
        background: #f8f9fa; }
      .site-mobile-menu .site-nav-wrap .arrow-collapse:before {
        font-size: 12px;
        z-index: 20;
        font-family: "icomoon";
        content: "\f078";
        position: absolute;
        top: 50%;
        left: 50%;
        -webkit-transform: translate(-50%, -50%) rotate(-180deg);
        -ms-transform: translate(-50%, -50%) rotate(-180deg);
        transform: translate(-50%, -50%) rotate(-180deg);
        -webkit-transition: .3s all ease;
        -o-transition: .3s all ease;
        transition: .3s all ease; }
      .site-mobile-menu .site-nav-wrap .arrow-collapse.collapsed:before {
        -webkit-transform: translate(-50%, -50%);
        -ms-transform: translate(-50%, -50%);
        transform: translate(-50%, -50%); }
    .site-mobile-menu .site-nav-wrap > li {
      display: block;
      position: relative;
      float: left;
      width: 100%; }
      .site-mobile-menu .site-nav-wrap > li > a {
        padding-left: 20px;
        font-size: 1rem; }
      .site-mobile-menu .site-nav-wrap > li > ul {
        padding: 0;
        margin: 0;
        list-style: none; }
        .site-mobile-menu .site-nav-wrap > li > ul > li {
          display: block; }
          .site-mobile-menu .site-nav-wrap > li > ul > li > a {
            padding-left: 40px;
            font-size: 1.65rem; }
          .site-mobile-menu .site-nav-wrap > li > ul > li > ul {
            padding: 0;
            margin: 0; }
            .site-mobile-menu .site-nav-wrap > li > ul > li > ul > li {
              display: block; }
              .site-mobile-menu .site-nav-wrap > li > ul > li > ul > li > a {
                font-size: 1.65rem;
                padding-left: 60px; }
    .site-mobile-menu .site-nav-wrap[data-class="social"] {
      float: left;
      width: 100%;
      margin-top: 30px;
      padding-bottom: 5em; }
      .site-mobile-menu .site-nav-wrap[data-class="social"] > li {
        width: auto; }
        .site-mobile-menu .site-nav-wrap[data-class="social"] > li:first-child a {
          padding-left: 15px !important; }

.sticky-wrapper {
  position: relative;
  z-index: 100;
  width: 100%; }
  .sticky-wrapper .site-navbar {
    -webkit-transition: .3s all ease;
    -o-transition: .3s all ease;
    transition: .3s all ease; }
  .sticky-wrapper .site-navbar {
    background: #fff; }
    .sticky-wrapper .site-navbar .site-logo a {
      color: #fff; }
    .sticky-wrapper .site-navbar ul li a {
      color: rgba(255, 255, 255, 0.7) !important; }
      .sticky-wrapper .site-navbar ul li a.active {
        color: #fff !important; }
  .sticky-wrapper.is-sticky .site-navbar {
    background: #fff;
    -webkit-box-shadow: 4px 0 20px -5px rgba(0, 0, 0, 0.2);
    box-shadow: 4px 0 20px -5px rgba(0, 0, 0, 0.2); }
    .sticky-wrapper.is-sticky .site-navbar .site-logo a {
      color: #c30d23; }
    .sticky-wrapper.is-sticky .site-navbar ul li a {
      color: #000 !important; }
      .sticky-wrapper.is-sticky .site-navbar ul li a.active {
        color: #c30d23 !important; }
  .sticky-wrapper .shrink {
    padding-top: 0px !important;
    padding-bottom: 0px !important; }
    @media (max-width: 991.98px) {
      .sticky-wrapper .shrink {
        padding-top: 30px !important;
        padding-bottom: 30px !important; } }

.toggle-button a.site-menu-toggle {
    color: #c30d23 !important;
    text-decoration: none;
    background-color: transparent;
}
/*
* ----------------------------------------------------
*   05. Slider Area CSS
* ----------------------------------------------------
*/

.hero {
  height: 100vh;
  width: 100%;
  background-size: cover;
  background-position: center center;
  background-repeat: no-repeat; }



/*
Removes white gap between slides - chagnge to base color of slide images
*/
.carousel {
  background:#007aeb;
}

/*
Forces image to be 100% width and not max width of 100%
*/
.carousel-item .img-fluid {
  width:100%;
}

/* 
anchors are inline so you need ot make them block to go full width
*/
.carousel-item a {
  display: block;
  width:100%;
}


/*
VIDEO
*/

#v-box {
  position: relative;
  background-color: black;
  height: 68vh;
  min-height: 25rem;
  width: 100%;
  overflow: hidden;
}

#v-box video {
  position: absolute;
  top: 50%;
  left: 50%;
  min-width: 100%;
  min-height: 100%;
  width: auto;
  height: auto;
  z-index: 0;
  -ms-transform: translateX(-50%) translateY(-50%);
  -moz-transform: translateX(-50%) translateY(-50%);
  -webkit-transform: translateX(-50%) translateY(-50%);
  transform: translateX(-50%) translateY(-50%);
}

#v-box .container {
  position: relative;
  z-index: 2;
}

#v-box .overlay-wcs {
  position: absolute;
  top: 0;
  left: 0;
  height: 100%;
  width: 100%;
  background-color: white;
  opacity: 0.7;
  z-index: 1;
	backdrop-filter: blur(5px);
}
#v-box .container img{
	width: 330px;
	height: 330px;
	z-index: 5;
}
@media (max-width: 575.98px) {
	#v-box .container img {
	width: 110px;
	height: 110px;
}
#v-box{
height: 250px;
}
	
}

@media (min-width: 576px) and (max-width: 767.98px) {
	#v-box .container img {
	width: 130px;
	height: 130px;
}
#v-box{
height: 300px;
}
}


@media (min-width: 768px) and (max-width: 991.98px) {
	#v-box .container img {
	width: 150px;
	height: 150px;
}
#v-box{
height: 300px;
}
}

/*
* ----------------------------------------------------
*   06. Parallax Area CSS
* ----------------------------------------------------
*/

.bg-gray {
 background:#f2f2f2;
 background-image:-moz-linear-gradient(135deg,#e5e5e5 0%,#e5e5e5 49%,#f2f2f2 49%,#f2f2f2 100%);
 background-image:-webkit-linear-gradient(135deg,#e5e5e5 0%,#e5e5e5 49%,#f2f2f2 49%,#f2f2f2 100%);
 background-image:-ms-linear-gradient(135deg,#e5e5e5 0%,#e5e5e5 49%,#f2f2f2 49%,#f2f2f2 100%)
}

.jumbotron{
	margin-bottom: 0; 
	position: relative;
	background-color: #fff;
}
.jumbotron h1{
	font-family: a-otf-midashi-mi-ma31-pr6n, serif;
font-style: normal;
font-weight: 600;
}
.parallax {
  /* Set a specific height */
  height: 500px;

  /* Create the parallax scrolling effect */
  background-attachment: fixed;
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
}

/* Paragraph for Parallax Section */ 
.parallax p {
font-size: 24px;
color:#f5f5f5;
text-align: center;
line-height: 60px;
}
 
/* Heading for Parallax Section */ 
.parallax h1 {
text-transform: uppercase;
color: rgb(255, 255, 255);
font-size: 40px;
text-align: center;
padding-top: 60px;
line-height: 100px;
}

#parallax-static {
    background-image: url("../images/bg.jpg");
}

#parallax-slightly-moving {
    background-image: url("../images/bg.jpg");
}
#parallax-slightly-moving::after {
  /* Display and position the pseudo-element */
  content: " ";
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;

  /* Move the pseudo-element back away from the camera,
   * then scale it back up to fill the viewport.
   * Because the pseudo-element is further away, it appears to move more slowly, like in real life. */
  /*transform: translateZ(-1px) scale(1.5);*/
  /* Force the background image to fill the whole element. */
  background-size: 100%;
  /* Keep the image from overlapping sibling elements. */
  z-index: -1;
}
@media (max-width: 575.98px) {
	.jumbotron h1{
		font-size: 1.3rem;
}
}
/*
* ----------------------------------------------------
*   07. Service Area CSS
* ----------------------------------------------------
*/

.single-service {
  text-align: center;
  border: 1px solid #ddd;
  padding: 25px 40px;
  -webkit-transition:.4s;
  transition: .4s;
margin-bottom:20px;
}
.single-service i.fa {
  width: 60px;
  height: 60px;
  font-size: 30px;
  line-height: 60px;
  border: 1px solid #c30d23;
  margin-bottom: 30px;
  border-radius: 50%;
  color: #c30d23;
  -webkit-transition:.4s;
  transition: .4s;
}
.single-service:hover i.fa {
  background-color: #c30d23;
  color: #fff;
  border-color: #c30d23;
}
.single-service:hover {
  box-shadow: -3px 3px 3px 0px #ddd;
}


/*
* ----------------------------------------------------
*   07. Profile Area CSS
* ----------------------------------------------------
*/
.profilePhoto {
	width: 80%;
	text-align: center;
	margin: 0 auto;
}
.profileHeader {
}

.profileHeader h2, h5{
font-family: a-otf-midashi-mi-ma31-pr6n, serif;
font-style: normal;
font-weight: 600;
}
.google-maps {
position: relative;
padding-bottom: 35%; // これが縦横比
height: 0;
overflow: hidden;
}
.google-maps iframe {
position: absolute;
top: 0;
left: 0;
width: 100% !important;
height: 100% !important;
}
hr.red {
    margin-top: 1rem;
    margin-bottom: 1rem;
    border: 0;
    border-top: 1px solid #c30d23;
}
@media (max-width: 575.98px) {
	.profileHeader h2, h5 {
		font-size: 1.2rem;
	}
	.prof {
		text-align: center!important;
	}
	.prof2 {
		text-align: left!important;
	}
}
/*
* ----------------------------------------------------
*  Movie
* ----------------------------------------------------
*/
.movie-wrap {
     position: relative;
     padding-bottom: 56.25%; /*アスペクト比 16:9の場合の縦幅*/
     height: 0;
     overflow: hidden;
}
 
.movie-wrap iframe {
     position: absolute;
     top: 0;
     left: 0;
     width: 100%;
     height: 100%;
}

.insta_btn {
  display: inline-block;
  text-align: center;/*中央揃え*/
  color: #050000;/*文字色*/
  /*font-size: 20px;文字サイズ*/
  text-decoration: none;/*下線消す*/
}

.insta_btn:hover {/*ホバー時*/
  color:#050000;/*文字色*/
  transition: .5s;/*ゆっくり変化*/
}

.insta_btn .insta{/*アイコンの背景*/
  position: relative;/*相対配置*/
  display: inline-block;
  width: 50px;/*幅*/
  height: 50px;/*高さ*/
  background: -webkit-linear-gradient(135deg, #427eff 0%, #f13f79 70%) no-repeat;
  background: linear-gradient(135deg, #427eff 0%, #f13f79 70%) no-repeat;/*グラデーション①*/
  overflow: hidden;/*はみ出た部分を隠す*/
  border-radius: 13px;/*角丸に*/

}

.insta_btn .insta:before{/*グラデーションを重ねるため*/
  content: '';
  position: absolute;/*絶対配置*/
  top: 23px;/*ずらす*/
  left: -18px;/*ずらす*/
  width: 60px;/*グラデーションカバーの幅*/
  height: 60px;/*グラデーションカバーの高さ*/
  background: -webkit-radial-gradient(#ffdb2c 10%, rgba(255, 105, 34, 0.65) 55%, rgba(255, 88, 96, 0) 70%);
  background: radial-gradient(#ffdb2c 10%, rgba(255, 105, 34, 0.65) 55%, rgba(255, 88, 96, 0) 70%);/*グラデーション②*/
}

.insta_btn .fa-instagram {/*アイコン*/
  color: #FFF;/*白に*/
  position: relative;/*z-indexを使うため*/
  z-index: 2;/*グラデーションより前に*/
  font-size: 35px;/*アイコンサイズ*/
  line-height: 50px;/*高さと合わせる*/
}
/*
* ----------------------------------------------------
*   08. Contact Area CSS
* ----------------------------------------------------
*/
.with-errors {
	color: darkred!important;
}
.bg-info {
    background-color: #B4BABB !important;
}
/*
* ----------------------------------------------------
*   09. Footer Area CSS
* ----------------------------------------------------
*/


.page-footer {
 background:#282828;
 background-image:-moz-linear-gradient(135deg,#1b1b1b 0%,#1b1b1b 49%,#282828 49%,#282828 100%);
 background-image:-webkit-linear-gradient(135deg,#1b1b1b 0%,#1b1b1b 49%,#282828 49%,#282828 100%);
 background-image:-ms-linear-gradient(135deg,#1b1b1b 0%,#1b1b1b 49%,#282828 49%,#282828 100%);
 color:#fff;
 text-align:left;
 padding-top:3rem;
 padding-bottom:1rem
}
.copy {
	color: white;
	font-size: .85rem;
}

/* Back to top button
---------------------------------- */
#back-top {
	position: fixed;
	z-index: 1000;
	bottom: 40px;
	right: 50px;
}
#back-top a {
	width: 60px;
	height: 60px;
	display: block;
	text-align: center;
	font: 11px/100% Arial, Helvetica, sans-serif;
	text-transform: uppercase;
	text-decoration: none;
	color: #fff;
	background: #19191A;
	border-radius:60px;
	/* background color transition */
	-webkit-transition: 1s;
	-moz-transition: 1s;
	transition: 1s;
}
#back-top a:hover {
	background: #c30d23;
	color: #fff;
}
/* arrow icon (span tag) */
#back-top i {
	margin-top: 15px;
	font-size: 28px;
}
 @media only screen and (min-width : 320px) and (max-width : 480px) {
#back-top {
	position: fixed;
	bottom: 10px;
	right: 30px;
}
#back-top a {
	width: 40px;
	height: 40px;
}
#back-top i {
	margin-top: 7px;
	font-size: 20px;
}
}

/* NEWS
---------------------------------- */

div.infoList {
	padding:0px;
}
.ymd {
	font-weight:bold;
}
div.infoList ul {
	margin:5px 0px 5px;
	list-style:none;
	margin-left:1em;
}
div.infoList ul li {
	border-bottom:1px dotted #ccc;
	padding:6px 0px;
	list-style:none;
	margin-bottom:0px;
}
div.infoList ul li a {
}
div.infoList ul li a:hover {
}
div.infoList ul li .news a {
	margin-right:4px;
	background-color:#428BCA;
	color:#fff;
	padding:2px 7px 2px;
	line-height:14px;
	text-decoration:none;
	position:relative;
}
div.infoList ul li .report a {
	margin-right:4px;
	background-color:#F19640;
	color:#fff;
	padding:2px 7px 2px;
	line-height:14px;
	text-decoration:none;
	position:relative;
}
.clearfix:after {
	content:".";
	display:block;
	clear:both;
	height:0;
	visibility:hidden;
}
.clearfix {
	display:inline-block;
}
* html .clearfix {
	height:1%;
}
.clearfix {
	display:block;
}
ul#newsList {
	margin:0 0 15px;
	padding:0;
	font-family:"メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
}
ul#newsList li {
	color:#333;
	margin:0;
	padding:5px 0;
	margin-bottom:3px;
	border-bottom:1px dotted #ccc;
	line-height:140%;
	list-style-type:none;
	text-align-last:left;
	overflow:visible;
}

/* WORK FLOW
---------------------------------- */


.step{
  list-style-type: none;
  padding:0;
  margin:0;
}
.step  dd {
	border-bottom: dotted 0px #C8C6C6;

}
.step dt{
  position: relative;
  width:100px;
  background: #c30d23;
  padding: 1em;
  margin-bottom: 1em;
  text-align:center;
  color: #fff;
}
.step dt:after{
  content: "";
  position: absolute;
  width: 0;
  height: 0;
  bottom: -10px;
  left: 0;
  border-style: solid;
  border-color: #c30d23 transparent transparent transparent;
  border-width: 10px 50px 0 50px;
  z-index: 1;
}
.step dt{
  float: left;
}

.step dd{
  margin-left: 110px;
  text-align:left;
}