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

/*その他と主な共通部分は省略*/

@import "https://use.fontawesome.com/releases/v5.13.0/css/all.css";
.colors-e a, a.colors-e {
    color: #397AB7;
}

.btn,
a.btn,
button.btn {
  font-size: 1.2em;
  font-weight: 700;
  line-height: 1.5;
  position: relative;
  display: inline-block;
  padding: 1rem 4rem;
  cursor: pointer;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  -webkit-transition: all 0.3s;
  transition: all 0.3s;
  text-align: center;
  vertical-align: middle;
  text-decoration: none;
  letter-spacing: 0.1em;
  color: #212529;
  border-radius: 0.5rem;
}

.btn-wrap-pc-sp {
  max-width: 435px;
  margin: 0 auto 20px;
}

a.btn-pc-sp {
  line-height: 1.4;

  width: 49.5%;
  padding: 1.25rem 0;

  color: #ffff;
}

a.btn--contact {
  display: block;

  padding: 1.5rem 0;

  color: #fff;
  background: #d20010;
  -webkit-box-shadow: 0 5px 0 #b9000e;
  box-shadow: 0 5px 0 #b9000e;
}

a.btn--contact i {
  font-size: 2rem;
}

a.btn--contact i.fa-position-left {
  font-size: 3rem;

  left: 2rem;
}

a.btn--contact:hover {
	color: #fff;
	background: #C00000 !important;
}

a.btn--tel {
  display: block;

  margin-top: 15px;
  padding: 1rem 0;

  color: #fff;
  background: #094;
  -webkit-box-shadow: 0 5px 0 #008039;
  box-shadow: 0 5px 0 #008039;
}

a.btn--tel i {
  font-size: 2rem;
}

a.btn--tel i.fa-position-left {
  font-size: 3rem;

  left: 2rem;
}

a.btn--tel .number {
  line-height: 1;

  display: inline-block;

  margin-top: 0.5rem;
  padding: 0.25rem 2rem;

  letter-spacing: 0;

  color: #094;
  border-radius: 0.5rem;
  background: #fff;
}

a.btn--tel:hover {
	color: #fff;
	background: #157600 !important;

}

.fa-position-left {
  position: absolute;
  top: calc(50% - 0.5em);
  left: 1rem;
}

.fa-position-right {
  position: absolute;
  top: calc(50% - 0.5em);
  right: 1rem;
}


.text-right{
	text-align: right !important;
}

.gyoukan{
	line-height: 1.2em; margin-top: 1.2em !important;
}

.colors_freezia{
	background: #F8F8F8 !important;
	color: #2e2e2e !important;
}


.colors_freezia_2{
	background: #006A31 !important;
	color: #FFF !important;
}

section#team h2{
	padding-top: 70px;
}

.top_bg{background: #efdfca; position: relative;}

.top_3{background: #495874; padding: 2%; line-height: 1.2em; color: #FFF; font-weight: bold; letter-spacing: 1px; display: inline-block;}

.top_3content{position: relative;}
.top_3box { position: absolute; right:0;  height: auto; width: 45%; text-align: right;}
.kadomaru{ border-radius: 17px;
border: 2px solid #2e2e2e;
padding:5% 3%;
text-align: center;}

.kaiketsu{margin-top: 50px; font-size: 3.5em; line-height: 1.2em; }

.bottom_30{margin-bottom: 40px;}
.bottom_40{margin-bottom: 40px;}
.bottom_50{margin-bottom: 50px;}

.top_caption{ font-size: 3.5em; letter-spacing: 1px; line-height: 1.2em; padding:5% 15% 5% 0;}
.top_caption_s{ font-size: 2em; letter-spacing: 1px; line-height: 1.2em;}

@media screen and (max-width: 767px) {
  .kaiketsu{ font-size: 1.2em !important; 
  }
	.top_caption{ font-size: 1.2em !important; padding:5% 15% 5% 0;}
	.top_caption_s{ font-size: 1em !important;}
	.top_3box { position: absolute; right:0;  height: auto; width: 50%; text-align: right;}
	.lead{padding:0 4%;}
	.md_hidden{display: none;}

}

@media screen and (min-width: 768px) {
	.sm_hidden{display: none;}
}

.skillbars .skillbar-title{ width: auto !important;}
.incut{ min-height: 700px !important;}

table{
	width: 92%;
	border-spacing: 0;
	margin:0 auto 50px;
	color: #2e2e2e !important;
}

table th{
	border-bottom: solid 2px #f8ad3a;
	line-height: 1.2em;
	padding: 10px 0;
}


table td{
  border-bottom: solid 2px #ddd;
  text-align: center;
  padding: 10px 0;
}


body,h1,h2,h3,h4,h5,h6 {
  font-family: "Helvetica Neue",
    Arial,
    "Hiragino Kaku Gothic ProN",
    "Hiragino Sans",
    Meiryo,
    sans-serif;
}

.colors-e .highlight, .colors-e .link, .colors-e.highlight, .colors-e.link{color: #f8ad3a}
.colors-h .highlight, .colors-h.highlight {color: #f8ad3a}

.colors-e .top-line:before {
    background-color: #006a31;
}

.background-60-d {background-color: #f8ad3a !important;}

.btn_storong{font-size: 1.2em !important; padding:5 6% !important;}

.simple li{
	text-align: left;
    font-size: 16px;
    margin-bottom: 10px;
    line-height: 24px;
	letter-spacing: 1.2px;}

.lead_left{text-align: left;}


.text-small{font-size: .7em;}

.btn_hidden{max-width: 600px; margin: 0 auto; border: 3px solid #006a31; padding:0 3% 8%; margin-top: 50px; }
h3{font-size: 1.3em; line-height: 1.2em; letter-spacing: 1.2px;}

.colors-e .gallery .filter .nav li a.active { background:#f8ad3a; color: #FFF; border-radius: 20px;/* 角丸指定 */ }

.hover-effect::after,.hover-effect::before
{content:'';}

.side-title{font-size: 1.4em !important; line-height: 1.2em; letter-spacing: 1px;}
.gallery .filter {padding: 8% 0 !important;}


/*スクロールデザイン*/

/*スクロールリンクの形状*/
.scroll-top {
  /*表示位置*/
  position: fixed;
  right: 20px;
  bottom: 10px;
  z-index: 2;
  /*はじめは非表示*/
  opacity: 0;
  visibility: hidden; 
  transition: opacity .5s, visibility .5s; /*それぞれに0.5秒の変化のアニメーション*/
  /*縦書き*/
  -webkit-writing-mode: vertical-rl;
    -ms-writing-mode: tb-rl;
    writing-mode: vertical-rl;
  /*改行禁止*/
    white-space: nowrap;
  /*矢印の動き*/
  animation: arrowmove 1s ease-in-out infinite;
}

@keyframes arrowmove{
      0%{bottom:20px;}
      50%{bottom:25px;}
     100%{bottom:20px;}
 }


/*.scroll-viewクラスがついたら出現*/
.scroll-top.scroll-view {
  opacity: 1;
  visibility: visible;
}

/*リンク全体の aタグの形状*/
.scroll-top a {
  text-decoration: none;
  color: #f8ad3a;
  text-transform: uppercase;
  font-size:0.9rem;
    display: block;
}

/*スクロールリンクの形状*/

.js-scroll a::after{
  content:"";
  position: absolute;
  top:0;
  right:0;
  width:1px;
  height: 50px;
  background:#f8ad3a;
}

.js-scroll a::before {
    content: "";
    position: absolute;
    top: 30px;
    right: -6px;
    width: 1px;
    height: 20px;
    background: #f8ad3a;
    transform: skewX(-31deg);
}

/*Edge IE11 hack*/
_:-ms-lang(x), .js-scroll a::before{
  right:-11px;
}

/*ページトップリンクの形状*/

.js-pagetop a::after{
  content:"";
  position: absolute;
  top:0;
  right:0;
  width:1px;
  height: 50px;
  background:#f8ad3a;
}

.js-pagetop a::before {
    content: "";
    position: absolute;
    top: 0;
    right: -6px;
    width: 1px;
    height: 20px;
    background: #f8ad3a;
    transform: skewX(31deg);
}

/*Edge IE11 hack*/
_:-ms-lang(x), .js-pagetop a::before{
  right:0;
}

@media (max-width: 991px) {
    h2 {
        font-size: 55px !important;
        line-height: 60px !important;
    }
}