@charset "UTF-8";
/*===============================================================
	変数
===============================================================*/
/*	画面左右のマージン	*/
/*	幅	*/
/*	グリッド幅  */
/*	セクション、コンテンツ間のマージン	*/
/*	ブロック間のマージン	*/
/*===============================================================
	色
===============================================================*/
/*===============================================================
	読み込み
===============================================================*/
/*===============================================================
	
	_reset.scss 2021/10/14
	
===============================================================*/
/* 初期化
----------------------------------------------------------------*/
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed,
figure, figcaption, footer, header, hgroup,
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
  margin: 0;
  padding: 0;
  border: 0;
  font-style: normal;
  font-weight: normal;
  font-size: 100%;
  line-height: 1.5;
  vertical-align: baseline;
  outline: none;
  box-sizing: border-box; }

img {
  width: 100%;
  height: auto;
  vertical-align: top;
  border: 0; }

blockquote, q {
  quotes: none; }

blockquote:before, blockquote:after,
q:before, q:after {
  content: '';
  content: none; }

input, textarea {
  margin: 0;
  padding: 0; }

input[type="submit"], textarea {
  font-family: inherit; }

table {
  border-collapse: collapse;
  border-spacing: 0; }

body {
  font-family: 'Hiragino Kaku Gothic Pro','メイリオ','Meiryo','ＭＳ Ｐゴシック',Osaka,sans-serif; }

caption, th, td {
  text-align: left;
  vertical-align: top; }

ul, li {
  list-style: none; }

option {
  padding-right: 1em; }

address, caption {
  font-style: normal;
  font-weight: normal; }

a, a:hover, a:focus {
  outline: none; }

ul a, li a {
  zoom: 1; }

strong {
  font-weight: bold; }

em {
  font-style: italic; }

* {
  box-sizing: border-box; }

/* HTML5
----------------------------------------------------------------*/
article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section {
  display: block; }

/*===============================================================
	_mixin.scss
===============================================================*/
/*===============================================================
	ボタン
	@include btn_base(#c00,#000,#fff,#fff,auto);
===============================================================*/
/*===============================================================
	矢印
	@include mx_arw();	
===============================================================*/
/*===============================================================
	三角
	@include mx_sankaku(幅,高さ,色,色hover,向き);	
===============================================================*/
/*===============================================================
	センタリング
	@include mx_margin_center();	
===============================================================*/
/*===============================================================
	斜線の背景
	@include mx_slash($color1,$color2,$width);	
===============================================================*/
/*===============================================================
	グラデーション
	@include mx_grade(色1,色2,向き（横:h / 縦:v）)
===============================================================*/
/*===============================================================
	
	_common.scss 2021/9/24
	
===============================================================*/
/*===============================================================

	html/body設定

----------------------------------------------------------------*/
html {
  height: -webkit-fill-available; }

body {
  width: 100%;
  color: #333;
  background: #f8f8f8;
  text-align: left;
  -webkit-text-size-adjust: none;
  /* 縦横文字サイズ同じ */
  -webkit-font-smoothing: antialiased;
  font-family: 'Noto Sans JP', sans-serif;
  min-height: 100vh;
  min-height: -webkit-fill-available; }

body.fixed {
  width: 100%;
  height: 100%;
  position: fixed; }

a {
  color: #333;
  transition: all 0.3s;
  text-decoration: none;
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
  cursor: pointer; }

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

*:focus {
  outline: none; }

#page {
  display: flex;
  flex-direction: column;
  min-height: 100vh; }

/* タブレット以下 */
/* for tablet max-width: 1070px */
/* SP向けレイアウトの指定：～640px */
@media only screen and (max-width: 800px) {
  body {
    overflow-x: hidden; } }
/*===============================================================
	
	基本文字サイズ、装飾
	
===============================================================*/
h1, h2, h3, h4, h5, h6 {
  line-height: 1.5;
  font-weight: bold; }

div,
p {
  font-size: 14px;
  line-height: 2;
  font-weight: 500; }

li {
  font-size: 14px;
  line-height: 1.6; }

sup {
  margin: 0;
  padding: 0;
  font-size: 12px;
  line-height: 15px; }

.bold {
  font-weight: bold; }

.small {
  font-size: small; }

.large {
  font-size: large; }

.normal {
  font-weight: normal; }

.txt_wrp {
  text-align: left; }

.note {
  margin-top: 5px;
  font-size: 12px;
  color: #aaa; }

span.title {
  white-space: nowrap; }

.txt_center {
  text-align: center; }

.nolink {
  pointer-events: none; }

/* タブレット以下 */
/* for tablet max-width: 1070px */
/* SP向けレイアウトの指定：～800px */
@media only screen and (max-width: 800px) {
  h1, h2, h3, h4, h5, h6, p, li, th, td, dt, dd, div {
    line-height: 1.6; }

  div,
  p {
    font-size: 3.5vw;
    line-height: 1.8; }

  li {
    font-size: 3.5vw;
    line-height: 1.6; }

  .note {
    margin-top: 1vw;
    font-size: 3vw; } }
/* for SP max-width: 800px */
/*===============================================================
	
	device
	
===============================================================*/
.sp {
  display: none; }

.tb {
  display: none; }

.pc {
  display: block; }

/* タブレット */
@media screen and (max-width: 1070px) {
  .tb {
    display: block; } }
/* SP */
@media only screen and (max-width: 800px) {
  .sp {
    display: block; }

  .pc {
    display: none; } }
/*===============================================================
	
	logo
	
===============================================================*/
.logo {
  font-size: 30px;
  font-family: 'Lato', sans-serif;
  font-weight: bold;
  z-index: 11; }
  .logo:hover {
    transition: all .2s;
    opacity: 0.8; }

/* SP */
@media only screen and (max-width: 800px) {
  .logo {
    font-size: 6vw; } }
/*===============================================================
	
	webフォント
	
===============================================================*/
/* Regular */
@font-face {
  font-family: 'Noto Sans JP';
  src: url("../font/NotoSansCJKjp-Regular_subset.woff") format("woff");
  font-weight: 300;
  font-style: normal; }
/* Medium */
@font-face {
  font-family: 'Noto Sans JP';
  src: url("../font/NotoSansCJKjp-Medium_subset.woff") format("woff");
  font-weight: 500;
  font-style: normal; }
/* Bold */
@font-face {
  font-family: 'Noto Sans JP';
  src: url("../font/NotoSansCJKjp-Bold_subset.woff") format("woff");
  font-weight: 700;
  font-style: normal; }
/*===============================================================
	
	レイアウト
	_rayout.scss

===============================================================*/
.full_width {
  padding-left: 50px;
  padding-right: 50px;
  width: 100%; }
  @media screen and (max-width: 800px) {
    .full_width {
      padding-left: 0;
      padding-right: 0; } }

.max_width {
  max-width: 1900px;
  padding-left: 50px;
  padding-right: 50px;
  margin-left: auto;
  margin-right: auto;
  width: 100%; }
  @media screen and (max-width: 800px) {
    .max_width {
      padding-left: 0;
      padding-right: 0; } }

.wide_width {
  max-width: 1500px;
  padding-left: 50px;
  padding-right: 50px;
  margin-left: auto;
  margin-right: auto;
  width: 100%; }
  @media screen and (max-width: 800px) {
    .wide_width {
      padding-left: 0;
      padding-right: 0; } }

.content_width {
  max-width: 1170px;
  padding-left: 50px;
  padding-right: 50px;
  margin-left: auto;
  margin-right: auto;
  width: 100%; }
  @media screen and (max-width: 800px) {
    .content_width {
      padding-left: 0;
      padding-right: 0; } }

.narrow_width {
  max-width: 800px;
  padding-left: 50px;
  padding-right: 50px;
  margin-left: auto;
  margin-right: auto;
  width: 100%; }
  @media screen and (max-width: 800px) {
    .narrow_width {
      padding-left: 0;
      padding-right: 0; } }

.absolute_full_width {
  margin-left: calc(50% - 50vw);
  margin-right: calc(50% - 50vw);
  width: 100%; }

/*===============================================================
	
	seciton
	headlineとcontentなど、複数の要素、機能を取りまとめるコンテナ的な親要素。
	幅はsection_innerに記述する
	
===============================================================*/
.section {
  width: 100%; }

.section_inner {
  margin: 0 auto;
  padding-top: 80px;
  padding-bottom: 100px;
  padding-left: 0;
  padding-right: 0;
  box-sizing: border-box; }
  @media screen and (max-width: 800px) {
    .section_inner {
      padding-top: 5vw;
      padding-bottom: 10vw;
      padding-left: 5vw;
      padding-right: 5vw; } }

/*===============================================================
	
	content 
	個別のコンテンツ
	
===============================================================*/
.content + .content {
  margin-top: 100px; }

.content + .headline {
  margin-top: 100px; }

.content .content + *,
.content * + .content {
  margin-top: 70px; }

.content_title + .content {
  margin-top: 0; }

.headline + .content {
  margin-top: 80px; }

/* タブレット以下 */
@media screen and (max-width: 1070px) {
  .content {
    width: 100%;
    margin: 0 auto;
    box-sizing: border-box; } }
/* for tablet */
/* SP向けレイアウトの指定：～736px */
@media screen and (max-width: 800px) {
  .content + .content {
    margin-top: 10vw; }

  .content + .headline {
    margin-top: 10vw; }

  .content .content + *,
  .content * + .content {
    margin-top: 8vw; }

  .content_title + .content {
    margin-top: 0; }

  .headline + .content {
    margin-top: 8vw; } }
/* for SP */
/*===============================================================
	
	block
	
===============================================================*/
.block + .block {
  margin-top: 80px; }

/* タブレット */
/* SP */
@media screen and (max-width: 800px) {
  .block + .block {
    margin-top: 8vw; } }
/*===============================================================
	_grid.scss
===============================================================*/
.grid_wrp {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: space-between;
  margin-top: -40px;
  box-sizing: border-box; }
  .grid_wrp .grid {
    box-sizing: border-box;
    margin-top: 40px; }
  .grid_wrp .grid .grid_wrp {
    margin-top: -20px; }
  .grid_wrp .grid .grid {
    margin-top: 20px; }
  .grid_wrp .grid_1_1 {
    width: 100%; }
  .grid_wrp .grid_2_1 {
    width: calc((100% - 40px)/2); }
  .grid_wrp .grid_3_1 {
    width: calc((100% - (40px * 2))/3);
    /* 40px * 2 = 80px */ }
  .grid_wrp .grid_3_2 {
    width: calc(100% - ((100% - (40px * 2))/3) - $grid_margin_pc); }
  .grid_wrp .grid_4_1 {
    width: calc((100% - (40px * 3))/4);
    /* 40px * 3 = 120px */ }
  .grid_wrp .grid_5_1 {
    width: calc((100% - (40px * 2))/5);
    /* 20px * 4 = 80px */ }
  .grid_wrp .grid_6_1 {
    width: calc((100% - (40px * 5))/6);
    /* 50px * 5 = 100px */ }
  .grid_wrp.grid_wrp3:after, .grid_wrp.grid_wrp4:after, .grid_wrp.grid_wrp4:before, .grid_wrp.grid_wrp5:after, .grid_wrp.grid_wrp5:before {
    content: "";
    display: block;
    height: 0;
    order: 1; }
  .grid_wrp.grid_wrp3:after {
    width: calc((100% - (40px * 2))/3); }
  .grid_wrp.grid_wrp4:after, .grid_wrp.grid_wrp4:before {
    width: calc((100% - (40px * 3))/4); }
  .grid_wrp.grid_wrp5:after, .grid_wrp.grid_wrp5:before {
    width: calc((100% - (40px * 2))/5); }
  @media screen and (max-width: 800px) {
    .grid_wrp {
      margin-top: -5vw; }
      .grid_wrp .grid {
        margin-top: 5vw; }
      .grid_wrp .grid .grid_wrp {
        margin-top: -3vw; }
      .grid_wrp .grid .grid {
        margin-top: 3vw; }
      .grid_wrp .grid_1_1 {
        width: 100%; }
      .grid_wrp .grid_2_1 {
        width: 100%; }
      .grid_wrp .grid_3_1 {
        width: calc((100% - 5vw)/2); }
      .grid_wrp .grid_3_2 {
        width: 100%; }
      .grid_wrp .grid_4_1 {
        width: calc((100% - 5vw)/2); }
      .grid_wrp .grid_5_1 {
        width: calc((100% - 5vw)/2); }
      .grid_wrp .grid_6_1 {
        width: calc((100% - 10vw)/3); }
      .grid_wrp.grid_wrp3:after {
        width: calc((100% - 80px)/3); }
      .grid_wrp.grid_wrp4:after, .grid_wrp.grid_wrp4:before {
        width: calc((100% - 120px)/4); }
      .grid_wrp.grid_wrp5:after, .grid_wrp.grid_wrp5:before {
        width: calc((100% - 80px)/5); }
      .grid_wrp .sp_grid_1 {
        width: 100% !important; } }

.title {
  font-weight: bold;
  text-transform: uppercase;
  z-index: 2;
  letter-spacing: .03em; }

.lead {
  font-weight: 500; }

.page_title,
.section_title {
  font-size: 35px;
  line-height: 1.6; }

.section_lead {
  font-size: 14px; }

.content_title {
  font-size: 30px;
  line-height: 1.6; }

.content_sub_title {
  font-size: 18px; }

.block_title {
  font-size: 25px;
  line-height: 1.6; }

.item_title {
  font-size: 18px; }

.headline02 {
  position: relative; }
  .headline02::before {
    content: '';
    position: absolute;
    top: 30px;
    left: 50%;
    right: 0;
    bottom: 0;
    background-color: #eee;
    height: 80px;
    transform: translateX(-50%);
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    width: calc(100% + 100px);
    z-index: -1; }

.page_header {
  margin-top: 150px;
  background-color: #eee; }
  .page_header .page_header_inner {
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
    padding: 20px 50px 30px; }
    .page_header .page_header_inner .txt {
      display: flex;
      align-items: center; }
      .page_header .page_header_inner .txt::before {
        content: '';
        width: 70px;
        height: 1px;
        background-color: #333;
        margin: 2px 20px 0 0; }

/* タブレット以下 */
@media screen and (max-width: 1070px) {
  .page_header .page_header_inner .txt::before {
    content: '';
    width: 5vw;
    height: 1px;
    margin: 2px 15px 0 0; } }
/* SP */
@media only screen and (max-width: 800px) {
  .page_title,
  .section_title {
    font-size: 6vw; }

  .section_lead {
    font-size: 3.5vw; }

  .content_title {
    font-size: 5vw; }

  .content_sub_title {
    font-size: 3.8vw; }

  .item_title {
    font-size: 4vw; }

  .headline02::before {
    content: '';
    position: absolute;
    top: 6vw;
    height: 15vw;
    width: 100vw; }

  .page_header {
    margin-top: 28vw;
    background-color: #eee; }
    .page_header .page_header_inner {
      flex-direction: column;
      align-items: flex-start;
      padding: 5vw 5% 7vw; }
      .page_header .page_header_inner .txt {
        margin-top: 5vw;
        flex-direction: column;
        align-items: flex-start; }
        .page_header .page_header_inner .txt::before {
          content: '';
          margin: 0 0 2vw 0; } }
#header {
  position: fixed;
  top: 0;
  left: 0;
  width: 100vw;
  z-index: 99;
  background-color: #fff; }

#header.top_header {
  background-color: transparent;
  position: static; }
  #header.top_header .header_wrp {
    height: 100px; }

#header.top_header.fixed {
  position: fixed;
  top: 0;
  left: 0;
  background-color: #fff; }
  #header.top_header.fixed .header_wrp {
    height: 80px; }

#header.top_header.upmove {
  position: fixed;
  width: 100%;
  animation: UpAnime 0.5s forwards; }

@keyframes UpAnime {
  from {
    opacity: 1;
    transform: translateY(0); }
  to {
    opacity: 0;
    transform: translateY(-100px); } }
#header.top_header.downmove,
#header.downmove {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  animation: DownAnime 0.5s forwards; }

@keyframes DownAnime {
  from {
    opacity: 0;
    transform: translateY(-100px); }
  to {
    opacity: 1;
    transform: translateY(0); } }
.header_wrp {
  position: relative;
  display: flex;
  justify-content: space-between;
  align-items: center;
  flex-wrap: wrap;
  height: 80px; }
  .header_wrp .nav {
    display: flex;
    justify-content: flex-end;
    flex-wrap: wrap;
    align-items: center;
    width: calc(100% - 200px);
    letter-spacing: .05em;
    margin-right: -8px; }
  .header_wrp .nav.pc_nav a.current {
    transition: 0s;
    border: solid 2px #333; }
  .header_wrp .nav li {
    position: relative; }
  .header_wrp li:not(:last-child) {
    margin-right: 40px; }
  .header_wrp li:last-of-type ul li {
    padding-left: 2px; }
  .header_wrp li:first-of-type ul li {
    padding-right: 2px; }
  .header_wrp li a {
    display: flex;
    flex-direction: column;
    font-weight: bold;
    text-align: center;
    width: 100%;
    padding: 2px 8px; }
    .header_wrp li a::after {
      position: absolute;
      bottom: -2px;
      left: 25%;
      display: block;
      content: "";
      width: 50%;
      height: 2px;
      background: #333;
      transform: scale(0, 1);
      transform-origin: center top;
      transition: transform 0.3s; }
    .header_wrp li a:hover::after {
      transform: scale(1, 1); }
  .header_wrp a.current:hover::after {
    transform: scale(0, 1); }
  .header_wrp .current + ul {
    display: none; }
  .header_wrp li a span {
    color: #053e62;
    font-size: 13px; }
  .header_wrp .nav li ul {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    white-space: nowrap;
    top: -8px;
    text-align: center;
    opacity: 0;
    transition: all .3s; }
  .header_wrp .nav li:hover ul {
    opacity: 1; }
  .header_wrp .nav li ul li {
    font-size: 11px;
    margin: 0; }

.sp_nav {
  display: none; }

/* タブレット以下 */
@media screen and (max-width: 1070px) {
  .header_wrp li:not(:last-child) {
    margin-right: 2.8vw; }
  .header_wrp li a {
    padding: 0; }
  .header_wrp li a.current {
    padding: 2px 5px; } }
/* SP向けレイアウトの指定：～736px */
@media only screen and (max-width: 800px) {
  #header.top_header {
    transition: all .2s; }
    #header.top_header .header_wrp {
      height: 16vw; }

  #header.top_header.fixed .header_wrp {
    height: 16vw; }

  #header.top_header.upmove,
  #header.top_header.downmove {
    animation: none;
    height: auto;
    padding: 0;
    display: block; }

  .header_wrp {
    padding: 0 5vw;
    height: 18vw; }
    .header_wrp .nav {
      width: calc(100% - 40vw);
      margin-right: 0; }
    .header_wrp .nav.pc_nav {
      display: none; }

  .menu {
    position: relative;
    display: block;
    width: 5vw;
    height: 4vw;
    margin: 0 0 0 auto;
    z-index: 11;
    cursor: pointer; }
    .menu span {
      display: inline-block;
      transition: all .4s;
      position: absolute;
      left: 0;
      height: 2px;
      background: #333;
      width: 100%; }
    .menu span:nth-of-type(1) {
      top: 0; }
    .menu span:nth-of-type(2) {
      top: 48%;
      transform: translateY(-50%);
      -webkit-transform: translateY(-50%);
      -ms-transform: translateY(-50%); }
    .menu span:nth-of-type(3) {
      bottom: 0; }

  .menu.active span:nth-of-type(1) {
    top: 50%;
    left: 50%;
    transform: translateX(-50%) translateY(50%) rotate(-45deg);
    -webkit-transform: translateX(-50%) translateY(50%) rotate(-45deg);
    -ms-transform: translateX(-50%) translateY(50%) rotate(-45deg);
    width: 100%; }

  .menu.active span:nth-of-type(2) {
    opacity: 0; }

  .menu.active span:nth-of-type(3) {
    top: 50%;
    left: 50%;
    transform: translateX(-50%) translateY(50%) rotate(45deg);
    -webkit-transform: translateX(-50%) translateY(50%) rotate(45deg);
    -ms-transform: translateX(-50%) translateY(50%) rotate(45deg);
    width: 100%; }

  /*-------------------------------------------------------------
  	
  	sp_nav表示
  	
  -------------------------------------------------------------*/
  .sp_nav {
    display: block;
    position: fixed;
    top: 0;
    right: -120%;
    min-height: 100vh;
    min-height: -webkit-fill-available;
    -webkit-overflow-scrolling: touch;
    overflow-y: auto;
    width: 100%;
    background: #f8f8f8;
    transition: all .3s ease-in-out;
    z-index: 10; }
    .sp_nav.panelactive {
      right: 0; }
    .sp_nav .header_nav {
      position: relative;
      padding: 0 5vw;
      margin-top: 38vw;
      display: block;
      height: 100%;
      width: 100%; }
    .sp_nav li {
      display: flex;
      align-items: center;
      justify-content: center;
      margin: 0;
      margin-top: 10vw;
      padding: 0; }
      .sp_nav li:first-of-type {
        margin-top: 0; }
      .sp_nav li:not(:last-child) {
        margin-right: 0; }
    .sp_nav li a {
      width: auto;
      font-size: 3.8vw;
      padding: 0;
      opacity: 0; }
      .sp_nav li a:hover::after {
        transform: scale(0, 0); }
    .sp_nav li a.current {
      position: relative; }
    .sp_nav li a.current::after {
      display: none; }
    .sp_nav > .header_contact {
      width: 100%;
      position: absolute;
      bottom: 0; }
    .sp_nav .header_contact {
      background: #333;
      text-align: center;
      padding: 4vw 0; }
      .sp_nav .header_contact .header_sns {
        width: 90%;
        margin: 3vw auto 0;
        border-top: solid 1px #444;
        padding-top: 3vw; }
        .sp_nav .header_contact .header_sns a {
          display: flex;
          align-items: center;
          flex-direction: row;
          font-size: 3.2vw;
          letter-spacing: .08em;
          font-weight: normal;
          color: #aaa;
          transition: all .3s;
          opacity: 1; }
          .sp_nav .header_contact .header_sns a:hover {
            opacity: .7; }
          .sp_nav .header_contact .header_sns a img {
            width: 5vw;
            height: auto;
            margin-right: 2vw; }
    .sp_nav .header_contact a {
      color: #fff;
      font-size: 4vw;
      letter-spacing: .1em; }
    .sp_nav .close {
      position: relative;
      padding-left: 20px; }

  html.is-fixed,
  html.is-fixed body {
    height: 100;
    overflow: hidden; }

  .sp_nav.panelactive .header_nav li:first-child {
    animation-delay: .2s; }
  .sp_nav.panelactive .header_nav li:nth-child(2) {
    animation-delay: .3s; }
  .sp_nav.panelactive .header_nav li:nth-child(3) {
    animation-delay: .4s; }
  .sp_nav.panelactive .header_nav li:nth-child(4) {
    animation-delay: .5s; }
  .sp_nav.panelactive .header_nav li:nth-child(5) {
    animation-delay: .6s; }
  .sp_nav.panelactive .header_nav li:nth-child(6) {
    animation-delay: .6s; }
  .sp_nav.panelactive .header_nav li a {
    opacity: 1; }
  .sp_nav.panelactive .fade_down {
    animation-name: fadeDownAnime;
    animation-duration: .5s;
    animation-fill-mode: forwards;
    opacity: 0; }
  @keyframes fadeDownAnime {
    from {
      opacity: 0;
      transform: translateY(-20px); }
    to {
      opacity: 1;
      transform: translateY(0); } } }
#footer {
  position: relative;
  background: #333;
  margin-top: auto; }

.footer_content {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 30px 0;
  color: #fff; }
  .footer_content a {
    color: #fff; }

.footer_content + .footer_content {
  border-top: solid 1px #444; }

.footer_block {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap; }
  .footer_block .logo {
    margin-right: 30px; }
  .footer_block .address {
    font-size: 14px;
    padding-top: 5px;
    margin-right: 30px; }
  .footer_block .tell {
    width: 230px;
    font-size: 24px;
    font-weight: bold;
    padding-right: 20px;
    letter-spacing: .05em; }

.connection {
  text-align: center;
  justify-content: flex-end; }
  .connection .btn {
    margin-top: 10px;
    width: 250px;
    margin-left: 10px; }

.footer_info {
  flex-direction: column;
  align-items: flex-start; }
  .footer_info .info_block_bottom {
    display: flex;
    align-items: center;
    margin-top: 15px; }
  .footer_info .footer_nav {
    display: flex; }
    .footer_info .footer_nav li {
      margin-right: 30px;
      font-size: 14px; }
    .footer_info .footer_nav a {
      transition: all .3s; }
      .footer_info .footer_nav a:hover {
        opacity: .7; }
  .footer_info .footer_sns {
    margin-left: 30px;
    order: 2; }
    .footer_info .footer_sns .sns_item {
      padding-top: 1px; }
      .footer_info .footer_sns .sns_item a {
        display: flex;
        align-items: center;
        font-size: 13px;
        letter-spacing: .08em;
        color: #aaa;
        transition: all .3s; }
        .footer_info .footer_sns .sns_item a:hover {
          opacity: .7; }
      .footer_info .footer_sns .sns_item a img {
        width: 20px;
        height: auto;
        margin-right: 8px; }
    .footer_info .footer_sns .sns_item + .sns_item {
      margin-left: 15px; }
  .footer_info .copyright {
    font-size: small;
    color: #aaa; }

.prohome {
  width: 250px; }
  .prohome .prohome_txt {
    width: 100%;
    text-align: center;
    padding: 3px 0 5px;
    background-color: #F5F2E7;
    color: #5C4F40;
    margin-bottom: -6px; }
    .prohome .prohome_txt::after {
      content: "";
      display: inline-block;
      width: 8px;
      height: 8px;
      background-image: url("../images/assets/arrow_up_right.svg");
      background-size: contain;
      background-repeat: no-repeat;
      margin-left: 8px;
      padding-bottom: 1px; }
  .prohome img {
    width: 100%;
    height: auto; }

/* タブレット以下 */
@media screen and (max-width: 1070px) {
  .connection .btn {
    margin-left: 0;
    width: 250px; }
    .connection .btn a {
      display: block;
      width: 100%;
      text-align: center;
      font-size: 20px;
      font-weight: bold;
      padding: 12px 0;
      border: solid 1px #fff; } }
/* SP向け : ～736px */
@media only screen and (max-width: 800px) {
  .footer_wrp {
    padding: 0 5%; }

  .footer_content:first-of-type {
    padding: 10vw 0; }

  .footer_content {
    flex-direction: column;
    text-align: center;
    padding: 10vw 0; }

  .footer_block {
    justify-content: center; }
    .footer_block .logo {
      margin: 0;
      width: 100%; }
    .footer_block .address {
      font-size: 3.5vw;
      margin: 0;
      width: 100%; }
    .footer_block .tell {
      width: 100%;
      font-size: 5vw;
      padding-right: 0;
      margin-top: 3vw;
      order: 2; }

  .footer_company {
    order: 2;
    margin-top: 5vw; }

  .connection {
    justify-content: center;
    width: 100%;
    order: 1; }
    .connection .btn {
      width: 95%;
      margin: 0 auto;
      order: 1; }
      .connection .btn a {
        font-size: 5vw;
        font-weight: bold;
        padding: 3.5vw 0; }

  .footer_info {
    flex-direction: column;
    align-items: center;
    margin-top: 8vw;
    order: 2; }
    .footer_info .info_block_bottom {
      flex-direction: column;
      margin-top: 5vw; }
    .footer_info .footer_nav {
      display: flex; }
      .footer_info .footer_nav li {
        margin-right: 8vw;
        font-size: 3.5vw; }
      .footer_info .footer_nav li:last-of-type {
        margin-right: 0; }
    .footer_info .footer_sns {
      margin-left: 0;
      order: 0; }
      .footer_info .footer_sns .sns_item {
        padding-top: 1px; }
        .footer_info .footer_sns .sns_item a {
          font-size: 3.2vw; }
        .footer_info .footer_sns .sns_item a img {
          width: 5vw;
          height: auto;
          margin-right: 2vw; }
      .footer_info .footer_sns .sns_item + .sns_item {
        margin-left: 5vw; }
    .footer_info .copyright {
      margin-top: 4vw;
      font-size: 3vw; }

  .prohome {
    width: 70vw; }
    .prohome .prohome_txt {
      padding: 1vw 0 2vw;
      margin-bottom: -2vw; }
      .prohome .prohome_txt::after {
        content: "";
        display: inline-block;
        width: 2.4vw;
        height: 2.4vw;
        margin-left: 3vw;
        padding-bottom: .1vw; } }
/*===============================================================
	
	_utils.scss 2021/9/24
	
===============================================================*/
.align_center {
  text-align: center; }

.align_right {
  text-align: right; }

.align_left {
  text-align: left; }

.center {
  margin: 0 auto;
  text-align: center; }

@media only screen and (max-width: 800px) {
  .sp_align_center {
    text-align: center !important; }

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

  .sp_align_left {
    text-align: left !important; } }
/* for SP  */
/*===============================================================
	
	フロート関係
	
===============================================================*/
.clear {
  width: 100%;
  overflow: hidden; }

.clearboth {
  clear: both; }

.cf:before,
.cf:after {
  content: " ";
  display: table; }

.cf:after {
  clear: both; }

.cf {
  *zoom: 1; }

.flol {
  float: left; }

.flor {
  float: right; }

/*===============================================================
	
	PC/SP/TABLET
	
===============================================================*/
.sp {
  display: none; }

.tablet {
  display: none; }

.sp {
  display: none; }

.sp_tablet {
  display: none; }

.none {
  display: none !important; }

/* タブレット以下 */
@media screen and (max-width: 1070px) {
  .pc {
    display: none; }

  .tablet,
  .pc_tablet,
  .sp_tablet {
    display: block; } }
/* for tablet max-width: 1070px */
/* SP向けレイアウトの指定：～800px */
@media only screen and (max-width: 800px) {
  .sp {
    display: block; }

  .pc_tablet,
  .tablet {
    display: none; } }
/* for SP max-width: 800px */
/*===============================================================
	
	img fig
	
===============================================================*/
.fig img,
.fitimg img,
.photo img {
  width: 100%;
  height: auto; }

.video {
  position: relative;
  width: 100%;
  padding-top: 56.25%; }

.video iframe {
  position: absolute;
  top: 0;
  right: 0;
  width: 100% !important;
  height: 100% !important; }

/* タブレット以下 */
/* for tablet max-width: 1070px */
/* SP向けレイアウトの指定：～800px */
/* for SP max-width: 800px */
/*===============================================================
	
	マージン
	
===============================================================*/
.mt0 {
  margin-top: 0px !important; }

.mt05 {
  margin-top: 5px; }

.mt10 {
  margin-top: 10px; }

.mt15 {
  margin-top: 15px; }

.mt20 {
  margin-top: 20px; }

.mt25 {
  margin-top: 25px; }

.mt30 {
  margin-top: 30px; }

.mt40 {
  margin-top: 40px; }

.mt50 {
  margin-top: 50px; }

.mt60 {
  margin-top: 60px; }

.mt70 {
  margin-top: 70px; }

.mt80 {
  margin-top: 80px; }

.mt90 {
  margin-top: 90px; }

.mt100 {
  margin-top: 100px; }

.mb05 {
  margin-bottom: 5px; }

.mb10 {
  margin-bottom: 10px; }

.mb15 {
  margin-bottom: 15px; }

.mb20 {
  margin-bottom: 20px; }

.mb25 {
  margin-bottom: 25px; }

.mb30 {
  margin-bottom: 30px; }

.mb40 {
  margin-bottom: 40px; }

.mb50 {
  margin-bottom: 50px; }

/* タブレット以下 */
@media screen and (max-width: 1070px) {
  .mt0 {
    margin-top: 0px !important; }

  .mt05 {
    margin-top: 0.47vw; }

  .mt10 {
    margin-top: 0.93vw; }

  .mt15 {
    margin-top: 1.40vw; }

  .mt20 {
    margin-top: 1.87vw; }

  .mt25 {
    margin-top: 2.34vw; }

  .mt30 {
    margin-top: 2.80vw; }

  .mt40 {
    margin-top: 3.74vw; }

  .mt50 {
    margin-top: 4.67vw; }

  .mt60 {
    margin-top: 5.61vw; }

  .mt70 {
    margin-top: 6.54vw; }

  .mt80 {
    margin-top: 7.48vw; }

  .mt90 {
    margin-top: 8.41vw; }

  .mt100 {
    margin-top: 9.35vw; }

  .mb05 {
    margin-bottom: 0.47vw; }

  .mb10 {
    margin-bottom: 0.93vw; }

  .mb15 {
    margin-bottom: 1.40vw; }

  .mb20 {
    margin-bottom: 1.87vw; }

  .mb25 {
    margin-bottom: 2.34vw; }

  .mb30 {
    margin-bottom: 2.80vw; }

  .mb40 {
    margin-bottom: 3.74vw; }

  .mb50 {
    margin-bottom: 4.67vw; } }
/* for tablet max-width: 1070px */
/* SP向けレイアウトの指定：～800px */
@media screen and (max-width: 800px) {
  .mt0 {
    margin-top: 0px !important; }

  .mt05 {
    margin-top: 0.63vw; }

  .mt10 {
    margin-top: 1.25vw; }

  .mt15 {
    margin-top: 1.88vw; }

  .mt20 {
    margin-top: 2.50vw; }

  .mt25 {
    margin-top: 3.13vw; }

  .mt30 {
    margin-top: 3.75vw; }

  .mt40 {
    margin-top: 5.00vw; }

  .mt50 {
    margin-top: 6.25vw; }

  .mt60 {
    margin-top: 7.50vw; }

  .mt70 {
    margin-top: 8.75vw; }

  .mt80 {
    margin-top: 10.00vw; }

  .mt90 {
    margin-top: 11.25vw; }

  .mt100 {
    margin-top: 12.50vw; }

  .mb05 {
    margin-bottom: 0.63vw; }

  .mb10 {
    margin-bottom: 1.25vw; }

  .mb15 {
    margin-bottom: 1.88vw; }

  .mb20 {
    margin-bottom: 2.50vw; }

  .mb25 {
    margin-bottom: 3.13vw; }

  .mb30 {
    margin-bottom: 3.75vw; }

  .mb40 {
    margin-bottom: 5.00vw; }

  .mb50 {
    margin-bottom: 6.25vw; } }
/* for SP max-width: 800px */
/*===============================================================
	
	fixed
	
===============================================================*/
.fixed {
  position: fixed;
  top: 0; }

.bg_fixed {
  background-attachment: fixed; }

/* タブレット以下 */
@media screen and (max-width: 1070px) {
  .fixed {
    position: fixed;
    top: 0; } }
/* for tablet max-width: 940px */
/* SP向けレイアウトの指定：～800px */
/* for SP */
/*===============================================================
	
	テーブル
	
===============================================================*/
.table {
  width: 100%;
  text-align: left;
  font-size: 14px;
  line-height: 20px;
  border-collapse: separate;
  border-spacing: 0;
  border-bottom: solid 1px #ddd; }

.table th,
.table td {
  padding: 10px;
  border: solid 1px #ddd;
  border-bottom: 0;
  color: #000;
  box-sizing: border-box; }

.table th {
  font-weight: bold;
  border-right: 0;
  background: rgba(0, 0, 0, 0.05);
  color: #000;
  box-sizing: border-box; }

.table td {
  color: #000;
  box-sizing: border-box; }

.table td + td {
  border-left: 0; }

.table tr:nth-child(odd) {
  background: #fff; }

.table tr:nth-child(even) {
  background: rgba(0, 0, 0, 0.05); }

/* タブレット */
/* for tablet */
/* SP向けレイアウトの指定：～736px */
@media only screen and (max-width: 800px) {
  .table {
    padding: 0;
    margin-top: 0px; }

  .table th,
  .table td {
    padding: 3vw;
    font-size: 3.5vw;
    line-height: 1.6; }

  .table tr:nth-child(odd),
  .table tr:nth-child(even) {
    background: #fff; }

  .table_wrp_scroll {
    overflow-y: scroll; }

  .table_wrp_scroll .table {
    min-width: 200vw; } }
/* for SP */
/*===============================================================
	
	btn button ボタン
	
===============================================================*/
.btn + .btn {
  margin-top: 30px; }

.btn {
  width: 300px; }

.btn a {
  position: relative;
  display: block;
  text-align: center;
  padding: 10px 0;
  font-weight: 500;
  border: 2px solid #333;
  letter-spacing: .05em;
  font-size: 16px;
  transition: .4s;
  z-index: 2; }

.btn a::after {
  content: "";
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  background: #333;
  transform-origin: 100% 50%;
  transform: scaleX(0);
  transition: transform ease .4s;
  z-index: -1; }

.btn a:hover {
  color: #fff;
  background-color: #333; }

.btn a:hover::after {
  transform-origin: 0% 50%;
  transform: scaleX(1); }

.btn_line a::before {
  position: absolute;
  content: '';
  width: 25px;
  height: 2px;
  top: 50%;
  left: -12.5px;
  background-color: #333; }

.btn_full {
  width: 100% !important; }

.btn_small {
  width: 150px; }
  .btn_small a {
    font-size: 14px;
    padding: 6px 0 5px; }

.btn_white a {
  color: #fff;
  border: 2px solid #fff; }

.btn_white a::after {
  background-color: #fff; }

.btn_white a:hover {
  color: #333;
  background-color: #fff; }

/* SP */
@media screen and (max-width: 800px) {
  .btn {
    margin: 0 auto;
    width: 60vw; }

  .btn a {
    padding: 3vw 0;
    font-size: 3.5vw; }

  .btn_line a::before {
    width: 6vw;
    left: -3vw; }

  .btn_small {
    width: 100%; }
    .btn_small a {
      font-size: 3.5vw;
      padding: 1.5vw 0; }

  .btn + .btn {
    margin-top: 5vw; } }
/*===============================================================
	
	問い合わせフォーム
	
===============================================================*/
/*-------------------------------------------------------------
	form
-------------------------------------------------------------*/
.form {
  padding: 100px 80px; }
  .form dl {
    display: flex;
    align-items: flex-start; }
  .form dl:not(:first-of-type) {
    margin-top: 50px; }
  .form .title {
    display: flex;
    justify-content: space-between;
    align-items: center;
    align-self: flex-start;
    padding-top: 13px;
    padding-right: 5%;
    width: 30%;
    font-weight: 700; }
  .form dd {
    width: 70%; }
    .form dd p {
      letter-spacing: .05em; }
  .form .required {
    font-size: 12px;
    padding: 5px 10px 6px;
    color: #fff;
    line-height: 1;
    background-color: #333; }
  .form input[type="text"], .form input[type="email"], .form input[type="password"], .form textarea[type="textarea"] {
    padding: 12px 10px;
    width: 100%;
    border: none;
    border-radius: 3px; }
  .form input:focus,
  .form select:focus,
  .form textarea:focus {
    outline: solid 2px #2268c9; }
  .form select {
    color: #333;
    position: relative;
    padding: 12px 10px;
    width: 100%;
    border: none;
    border-radius: 3px; }
  .form .select_btn {
    width: 30%;
    border: none; }
  .form select::-ms-expand {
    display: none;
    /* デフォルトのスタイルを無効(IE用) */ }
  .form textarea {
    height: 300px; }
  .form .button02 {
    margin-top: 80px;
    text-align: center; }
    .form .button02 a {
      width: 300px; }

/* タブレット */
@media screen and (max-width: 1070px) {
  .form .title {
    width: 35%; }
  .form dd {
    width: 65%; } }
/* SP */
@media screen and (max-width: 800px) {
  .form {
    padding: 6vw 5vw; }
    .form dl {
      flex-direction: column; }
    .form dl:not(:first-of-type) {
      margin-top: 8vw; }
    .form .title {
      justify-content: flex-start;
      align-items: center;
      padding: 0;
      width: 100%; }
    .form dd {
      width: 100%;
      margin-top: 3vw; }
    .form .required {
      font-size: 3vw;
      margin-left: 3vw;
      padding: .8vw 2vw 1vw; }
    .form input[type="text"],
    .form input[type="password"],
    .form textarea {
      padding: 3vw 2vw; }
    .form select {
      padding: 3vw 2vw; }
    .form .select_btn {
      width: 80%; }
    .form textarea {
      height: 40vw; }
    .form .button02 {
      margin-top: 15vw; }
      .form .button02 a {
        width: 100%; } }
/*-------------------------------------------------------------
	確認画面
-------------------------------------------------------------*/
.form_confirm .form .title {
  padding-top: 0; }

/*-------------------------------------------------------------	
	jquery mailform バリデート
-------------------------------------------------------------*/
.validate {
  margin-bottom: 10px;
  display: none; }

.validate p {
  color: #E40011;
  font-size: 12px;
  line-height: 1.2;
  padding: 8px;
  background: #ffe7e9; }

.validate_submit {
  text-align: center;
  margin: 0 auto;
  width: 300px;
  padding-bottom: 20px; }

/* タブレット */
/* SP */
@media screen and (max-width: 800px) {
  .validate {
    margin-bottom: 3vw; }

  .validate p {
    font-size: 3vw;
    padding: 2vw; }

  .validate_submit {
    text-align: left;
    margin: 0 auto;
    width: 100%; } }
/* for SP max-width: 800px */
/*===============================================================
	
	概要 / 要項
	
===============================================================*/
.description a {
  color: #2268c9; }
.description dl {
  display: flex;
  justify-content: space-between; }
.description dt {
  font-weight: bold;
  padding: 30px 30px;
  width: 200px;
  border-bottom: 1px solid #aaa; }
.description dd {
  padding: 30px 30px;
  width: calc(100% - 200px);
  border-bottom: 1px solid #aaa; }
  .description dd li {
    padding-left: 1em;
    text-indent: -1em; }
  .description dd li + li {
    margin-top: 10px; }

/* タブレット */
/* SP */
@media screen and (max-width: 800px) {
  .description dt {
    width: 25%;
    padding: 4vw 0;
    font-size: 3.8vw; }
  .description dd {
    padding: 4vw 0;
    width: calc(100% - 25%); }
    .description dd li + li {
      margin-top: 2vw; } }
/*-------------------------------------------------------------
	テキスト入力
-------------------------------------------------------------*/
.txtinput {
  vertical-align: bottom;
  width: 100%;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  outline: 0;
  font-size: 14px;
  line-height: 1.6;
  margin: 0;
  padding: 10px;
  border: solid 1px #ccc;
  border-radius: 3px;
  box-sizing: border-box;
  transition: all 0.1s linear; }

.txtinput_postal {
  width: 150px; }

.txtinput:focus,
.txtinput_postal:focus {
  border-color: #999; }

/* タブレット以下 */
/* SP */
@media screen and (max-width: 800px) {
  .txtinput {
    font-size: 3vw;
    padding: 3vw; } }
/* for SP max-width: 736px */
/*-------------------------------------------------------------
	ラジオボタン
-------------------------------------------------------------*/
.radio li input {
  width: auto;
  display: none;
  border: 0;
  margin: 0; }

.radio li {
  padding: 0; }

.radio li + li {
  margin-top: 10px; }

/*　ラジオボタンの装飾　*/
.radio li label {
  display: inline-block;
  vertical-align: middle;
  position: relative;
  font-size: 14px;
  line-height: 20px;
  padding-left: 24px;
  cursor: pointer; }

.radio li label:before {
  content: "";
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  margin: auto;
  width: 16px;
  height: 16px;
  background: #fff;
  border: 1px solid #333;
  border-radius: 50%;
  box-sizing: border-box; }

.radio li label:after {
  content: "";
  position: absolute;
  top: 0;
  bottom: 0;
  left: 4px;
  margin: auto;
  width: 8px;
  height: 8px;
  background: #333;
  border-radius: 50%;
  transition: all 0.1s linear;
  transform: scale(0); }

.radio li input:checked + label:after {
  transform: scale(1); }

/* タブレット以下 */
/* SP */
@media screen and (max-width: 800px) {
  .radio li label {
    font-size: 4vw;
    line-height: 1.5; }

  .radio li + li {
    margin-top: 3vw; } }
/* for SP max-width: 736px */
/*-------------------------------------------------------------
	チェックボックス
-------------------------------------------------------------*/
.checkbox li {
  float: left;
  width: 33.3333%;
  padding: 0; }

.checkbox li:nth-child(4),
.checkbox li:nth-child(5),
.checkbox li:nth-child(6) {
  margin-top: 10px; }

.agreebox {
  font-size: 14px;
  line-height: 20px;
  text-align: center;
  padding-top: 20px; }

.checkbox li input,
.agreebox input {
  width: auto;
  display: none;
  border: 0;
  margin: 0; }

/*　チェックボックスの装飾　*/
.checkbox li label,
.agreebox label {
  display: inline-block;
  vertical-align: middle;
  position: relative;
  font-size: 14px;
  line-height: 20px;
  padding-left: 24px;
  cursor: pointer; }

.checkbox li label:before,
.agreebox label:before {
  content: "";
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  margin: auto;
  width: 16px;
  height: 16px;
  background: #fff;
  border-radius: 10%;
  border: 1px solid #333;
  box-sizing: border-box; }

.checkbox li label:after,
.agreebox label:after {
  content: "";
  position: absolute;
  top: -4px;
  left: 5px;
  margin: auto;
  width: 6px;
  height: 14px;
  border-right: 2px solid transparent;
  border-bottom: 2px solid transparent;
  transform: rotate(40deg);
  transition: border-bottom-color, border-right-color .2s linear; }

.checkbox li input:checked + label:after,
.agreebox input:checked + label:after {
  border-color: #333; }

/* タブレット以下 */
/* SP */
@media screen and (max-width: 800px) {
  .checkbox li {
    width: 100%; }

  .checkbox li + li {
    margin-top: 3vw; }

  .checkbox li label,
  .agreebox label {
    font-size: 4vw; }

  .agreebox {
    font-size: 4vw;
    text-align: left;
    padding-top: 3vw; } }
/* for SP max-width: 736px */
/*===============================================================
	
	セレクトボックス
	
===============================================================*/
select {
  -moz-appearance: none;
  -webkit-appearance: none;
  appearance: none;
  border: 0;
  padding: 15px 10px;
  width: 100%;
  background: #fff;
  font-size: 14px; }

input {
  font-size: 14px; }

.select_btn {
  border: none; }

.select_wrp {
  position: relative; }

/* タブレット */
/* for tablet */
/* SP */
@media screen and (max-width: 800px) {
  select {
    padding: 3vw 2vw;
    font-size: 3.5vw; }

  input {
    font-size: 3.5vw; }

  .select_btn {
    border: none; }

  .select_wrp::after {
    top: 40%;
    right: 4vw;
    width: 1vw;
    height: 1vw; } }
/* for SP */
/*-------------------------------------------------------------
	.セレクト 
-------------------------------------------------------------*/
.select option {
  color: #333;
  background: #fff; }

.select optgroup.area {
  color: #333;
  background: #eee; }

/*	 セレクタの装飾 */
.select_wrap {
  position: relative;
  overflow: hidden;
  display: inline-block;
  min-width: 30em;
  color: #333;
  background-color: #fff;
  background-image: -webkit-linear-gradient(top, #fff 0%, #eee 100%);
  background-image: linear-gradient(top, #fff 0%, #eee 100%);
  border: 1px solid #ddd;
  border-radius: 3px;
  box-sizing: border-box;
  transition: all 0.1s linear; }

.select_wrap:hover {
  border: 1px solid #999; }

.select_wrap2 {
  min-width: 20em; }

.select_wrap3 {
  min-width: 10em;
  margin-right: 5px; }

.select {
  position: relative;
  display: block;
  width: 200%;
  /* fallback non calc support */
  width: calc(100% + 5em);
  margin: 0;
  padding: 10px;
  font-size: 14px;
  line-height: 1.6;
  border: 0;
  outline: none;
  cursor: pointer; }

.select_wrap:after {
  content: '';
  position: absolute;
  top: 40%;
  right: 20px;
  transform: translateY(-50%);
  -webkit-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  width: 5px;
  height: 5px;
  border-top: solid 2px #333;
  border-right: solid 2px #333;
  transform: rotate(135deg); }

/* タブレット以下 */
/* SP */
@media screen and (max-width: 800px) {
  /*	 セレクタの装飾 */
  .select_wrap {
    min-width: auto;
    width: 80%;
    padding: 0;
    margin: 0; }

  .select_wrap + .select_wrap {
    margin-top: 10px; }

  .select {
    font-size: 3.5vw;
    padding: 10px; }
    .select::after {
      top: 40%;
      right: 5vw;
      width: 1vw;
      height: 1vw; }

  .select_wrap:after {
    top: 40%;
    right: 5vw;
    width: 1vw;
    height: 1vw; } }
/* for SP max-width: 736px */
/*-------------------------------------------------------------
	添付ファイル 
-------------------------------------------------------------*/
.fileinput {
  width: auto;
  display: none;
  border: 0;
  margin: 0; }

.file_btn {
  display: inline-block;
  min-width: 20em;
  color: #333;
  padding: 10px;
  font-size: 14px;
  line-height: 1.6;
  background-color: #fff;
  background-image: -webkit-linear-gradient(top, #fff 0%, #eee 100%);
  background-image: linear-gradient(top, #fff 0%, #eee 100%);
  border: 1px solid #ddd;
  border-radius: 3px;
  box-sizing: border-box;
  transition: all 0.1s linear;
  cursor: pointer; }

.file_btn:hover {
  border: 1px solid #999; }

.filename {
  display: inline-block;
  font-size: 14px;
  line-height: 1.6;
  margin-left: 5px; }

/* タブレット */
/* SP */
@media screen and (max-width: 800px) {
  .file_btn {
    min-width: auto;
    width: 100%;
    font-size: 4.5vw; }

  .filename {
    display: block;
    font-size: 3.5vw;
    margin-left: 0;
    margin-top: 2vw; } }
/* for SP max-width: 736px */
/*-------------------------------------------------------------
	サブミット（または汎用ボタン）
-------------------------------------------------------------*/
input[type="submit"] {
  display: inline-block;
  cursor: pointer;
  text-align: center;
  padding: 10px 0;
  width: 300px;
  font-weight: 500;
  border: 2px solid #333;
  letter-spacing: .05em;
  font-size: 16px;
  transition: all .4s;
  color: #333;
  background-color: #fff; }

.submit input {
  appearance: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  border-radius: 0; }

.submit {
  margin-top: 80px;
  text-align: center; }

.submit input:hover {
  color: #fff;
  text-decoration: none;
  background-color: #333; }

.submit input::after {
  content: "";
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  z-index: -1;
  background: #333;
  transform-origin: 100% 50%;
  transform: scaleX(0);
  transition: transform ease .2s; }

.submit input:hover::after {
  transform-origin: 0% 50%;
  transform: scaleX(1); }

/* タブレット */
/* SP */
@media screen and (max-width: 800px) {
  .submit,
  .btn_form {
    padding: 4vw 0; }

  .submit {
    margin-top: 10vw; }

  input[type="submit"] {
    padding: 3vw 0;
    width: 70%;
    font-size: 4vw; }

  .btn_form a {
    width: 70%;
    font-size: 4vw;
    padding: 3vw 0; }

  .submit input:focus {
    outline: none; }

  .submit .cap,
  .btn_form + .cap {
    font-size: 3vw;
    margin-top: 4vw; } }
/*-------------------------------------------------------------
	サブミット2
-------------------------------------------------------------*/
.submit_two {
  width: auto;
  display: flex;
  justify-content: center;
  margin: 80px auto 0; }
  .submit_two .btn + .btn {
    margin-top: 0;
    margin-left: 40px; }

/* タブレット */
/* SP */
@media screen and (max-width: 800px) {
  .submit_two {
    justify-content: space-between;
    margin: 10vw auto 0; }
    .submit_two .btn {
      width: 48%;
      margin: 0; }
    .submit_two .btn + .btn {
      margin-left: 0; }
    .submit_two .btn_form a {
      width: 100%; }
    .submit_two input[type="submit"] {
      width: 100%; } }
/*-------------------------------------------------------------
	search_box	
-------------------------------------------------------------*/
.search_box {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: space-between;
  width: 300px; }

.search_box input {
  width: 230px; }

.search_box .search_btn {
  width: 60px; }

.search_box .search_btn a {
  display: block;
  color: #fff;
  font-size: 15px;
  line-height: 2.8;
  text-align: center;
  letter-spacing: 0.2em;
  background: #a00;
  border-radius: 3px;
  margin-top: 1px; }

.search_box .search_btn a:hover {
  text-decoration: none;
  background: #c00; }

/* タブレット */
/* SP */
@media screen and (max-width: 800px) {
  .search_box {
    width: 100%; }

  .search_box input {
    width: calc(100% - 22vw); }

  .search_box .search_btn {
    width: 20vw; }

  .search_box .search_btn a {
    font-size: 4.6vw;
    line-height: 2.8; } }
/* for SP max-width: 736px */
/*===============================================================
	
	txtlink 2016/11/16
	
===============================================================*/
.txtlink a {
  padding-left: 15px;
  color: #500;
  text-decoration: none;
  position: relative;
  display: inline-block; }

.txtlink a:hover {
  color: #c00; }

.txtlink a:after {
  position: absolute;
  content: " ";
  width: 6px;
  height: 6px;
  top: 7px;
  bottom: auto;
  left: 0;
  right: auto;
  margin: auto;
  border-top: solid 2px #c00;
  border-left: solid 2px #c00;
  transform: rotate(135deg); }

.txtlink.arw_prev a:after {
  top: 7px;
  bottom: auto;
  left: 3px;
  right: auto;
  transform: rotate(-45deg); }

.txtlink.arw_after a {
  padding-left: 0;
  padding-right: 10px; }

.txtlink.arw_after a:after {
  left: auto;
  right: 0; }

.txtlink.arw_down a:after {
  top: 7px;
  bottom: auto;
  left: 2px;
  right: auto;
  transform: rotate(-135deg); }

.txtlink.arw_after_down a {
  padding-left: 0;
  padding-right: 10px; }

.txtlink.arw_after_down a:after {
  top: 7px;
  bottom: auto;
  left: auto;
  right: 0;
  transform: rotate(-135deg); }

/*	arw_box */
.txtlink.arw_box a {
  padding-left: 25px; }

.txtlink.arw_box a:before {
  content: ' ';
  width: 20px;
  height: 20px;
  background: #000;
  position: absolute;
  top: 2px;
  bottom: auto;
  left: 0;
  right: auto;
  margin: auto; }

.txtlink.arw_box a:after {
  border-top: solid 1px #fff;
  border-left: solid 1px #fff;
  top: 8px;
  bottom: auto;
  left: 5px;
  right: auto; }

/*===============================================================
	
	pankuzu
	
===============================================================*/
.pankuzu {
  padding: 10px 0;
  background-color: #f8f8f8;
  border-top: solid 1px #aaa; }

.pankuzu li {
  display: inline-block;
  color: #aaa;
  font-size: 12px;
  line-height: 1;
  padding-left: 10px;
  text-indent: 0; }

.pankuzu li:first-child {
  padding-left: 0; }

.pankuzu li a {
  text-decoration: none;
  position: relative;
  color: #333;
  padding: 0 18px 0 0; }

.pankuzu li a:hover {
  text-decoration: underline; }

.pankuzu li a:after {
  content: '';
  position: absolute;
  top: 0;
  bottom: 0;
  right: 0;
  margin: auto;
  width: 6px;
  height: 6px;
  border-right: solid 2px #333;
  border-bottom: solid 2px #333;
  transform: rotate(-45deg); }

/* タブレット */
@media screen and (max-width: 1070px) {
  .pankuzu {
    padding: 0; }

  .pankuzu ul {
    overflow-x: auto;
    white-space: nowrap;
    padding: 10px 0; } }
/* SP */
@media screen and (max-width: 800px) {
  .pankuzu ul {
    padding: 2vw 5%; }

  .pankuzu li {
    font-size: 3.0vw;
    padding-left: 1.5vw; }

  .pankuzu li a {
    padding-right: 3.5vw; } }
/*===============================================================
	
	ページネーション
	
===============================================================*/
.content + .pagenation,
.content + .pagenation_gallery {
  margin-top: 80px; }

.pagenation {
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  margin-top: -20px; }

.pagenation .num {
  margin-top: 20px; }

.pagenation .num:not(:last-child) {
  margin-right: 20px; }

.pagenation .num a,
.pagenation .num span {
  display: block;
  width: 40px;
  height: 40px;
  line-height: 35px;
  text-align: center;
  border: 2px solid #333; }

.pagenation .prev a,
.pagenation .next a {
  overflow: hidden;
  text-indent: -200%;
  position: relative; }
  .pagenation .prev a::after,
  .pagenation .next a::after {
    content: '';
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    margin: auto;
    border-right: solid 2px #333;
    border-bottom: solid 2px #333;
    width: 8px;
    height: 8px;
    transform: rotate(-45deg) translate(-2px, -2px); }
  .pagenation .prev a:hover,
  .pagenation .next a:hover {
    opacity: 0.5; }

.pagenation .prev a::after {
  transform: rotate(135deg) translate(-2px, -2px); }

.pagenation .num span {
  color: #fff;
  background-color: #333; }

.pagenation_gallery {
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  align-items: center; }

.pagenation_gallery .prev a,
.pagenation_gallery .next a {
  display: block;
  position: relative;
  text-align: center;
  border: 2px solid #333; }
  .pagenation_gallery .prev a::after,
  .pagenation_gallery .next a::after {
    content: '';
    position: absolute;
    top: 43%;
    border-right: solid 2px #333;
    border-bottom: solid 2px #333;
    width: 5px;
    height: 5px;
    transform: rotate(-45deg) translate(-2px, -2px); }
  .pagenation_gallery .prev a:hover,
  .pagenation_gallery .next a:hover {
    opacity: 0.7; }

.pagenation_gallery .prev a {
  padding: 8px 15px 8px 25px; }
  .pagenation_gallery .prev a::after {
    left: 8px; }

.pagenation_gallery .next a {
  padding: 8px 25px 8px 15px; }
  .pagenation_gallery .next a::after {
    right: 8px; }

.pagenation_gallery .prev a::after {
  transform: rotate(135deg) translate(-2px, -2px); }

.pagenation_gallery .back a {
  display: block;
  padding: 12px 35px;
  text-align: center;
  border: 2px solid #333;
  transition: all .3s;
  margin: 0 20px; }
  .pagenation_gallery .back a:hover {
    opacity: 0.7; }

.pagenation_gallery.pickup_pagenation .back a {
  width: 250px;
  color: #fff;
  background-color: #333; }

/* タブレット */
/* SP */
@media screen and (max-width: 800px) {
  .content + .pagenation,
  .content + .pagenation_gallery {
    margin-top: 10vw; }

  .pagenation {
    margin-top: -5vw; }

  .pagenation .num {
    margin-top: 5vw; }

  .pagenation .num:not(:last-child) {
    margin-right: 5vw; }

  .pagenation .num a,
  .pagenation .num span {
    width: 10vw;
    height: 10vw;
    line-height: 9vw; }

  .pagenation .prev a::after,
  .pagenation .next a::after {
    width: 2vw;
    height: 2vw; }

  .pagenation_gallery {
    justify-content: space-between;
    width: 70%;
    margin: 0 auto; }
    .pagenation_gallery .back {
      order: 3;
      width: 100%;
      margin-top: 5vw; }

  .pagenation_gallery .prev a::after,
  .pagenation_gallery .next a::after {
    width: 1.5vw;
    height: 1.5vw; }

  .pagenation_gallery .prev a {
    padding: 1.5vw 4vw 1.5vw 5vw; }
    .pagenation_gallery .prev a::after {
      left: 2vw; }

  .pagenation_gallery .next a {
    padding: 1.5vw 5vw 1.5vw 4vw; }
    .pagenation_gallery .next a::after {
      right: 2vw; }

  .pagenation_gallery .back a {
    padding: 2vw 0;
    margin: 0;
    color: #fff;
    background-color: #333; }

  .pagenation_gallery.pickup_pagenation .back a {
    width: 100%;
    margin-top: -5vw; } }
/*===============================================================
	
	モーダル
	
===============================================================*/
.noscroll {
  overflow: hidden; }

.modal_wrp {
  display: none;
  position: fixed;
  z-index: 9999;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%; }

.modal_wrp .bg {
  width: 100%;
  height: 100%;
  background: #f8f8f8; }

.modal_wrp .modal_content {
  max-width: 1170px;
  padding-left: 50px;
  padding-right: 50px;
  width: 100%;
  height: auto;
  position: absolute;
  top: 45%;
  left: 50%;
  box-sizing: border-box;
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%); }

/* タブレット */
@media screen and (max-width: 800px) {
  .modal_wrp .modal_content {
    width: 100%; } }
/*-------------------------------------------------------------
	content_inner	
-------------------------------------------------------------*/
.modal_content .content_inner {
  position: relative;
  padding: 100px 100px 80px; }

.modal_content .content_inner .pager {
  content: '';
  position: absolute;
  z-index: 1000;
  margin: auto;
  display: inline-block;
  box-sizing: border-box;
  width: 30px;
  height: 30px;
  cursor: pointer; }
  .modal_content .content_inner .pager a {
    display: block;
    width: 30px;
    height: 30px;
    border: solid 2px #333;
    overflow: hidden;
    text-indent: -200%;
    position: relative; }
  .modal_content .content_inner .pager a:hover {
    opacity: 0.7; }
  .modal_content .content_inner .pager a::after {
    content: '';
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    margin: auto;
    border-right: solid 2px #333;
    border-bottom: solid 2px #333;
    width: 8px;
    height: 8px;
    transform: rotate(-45deg) translate(-2px, -2px);
    transition: all .3s; }

.modal_content .content_inner .arw_prev a::after {
  transform: rotate(135deg) translate(-2px, -2px); }

.modal_content .content_inner .arw_prev {
  bottom: 0;
  left: 45%; }

.modal_content .content_inner .arw_next {
  bottom: 0;
  right: 45%; }

.modal_content .content_inner .close {
  content: '';
  position: absolute;
  z-index: 1000;
  width: 30px;
  height: 30px;
  top: 0;
  right: 0;
  text-indent: 100%;
  overflow: hidden;
  white-space: nowrap;
  cursor: pointer;
  -webkit-transition: all 0.1s linear;
  transition: all 0.1s linear; }

.modal_content .content_inner .close::before,
.modal_content .content_inner .close::after {
  content: '';
  position: absolute;
  top: 15px;
  right: 0;
  width: 30px;
  height: 2px;
  background: #333; }

.modal_content .content_inner .close::before {
  -webkit-transform: rotate(45deg);
  transform: rotate(45deg); }

.modal_content .content_inner .close::after {
  -webkit-transform: rotate(-45deg);
  transform: rotate(-45deg); }

.modal_content .content_inner .close:hover {
  opacity: 0.7; }

.modal_content .content_inner .title {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  font-size: 20px;
  z-index: 1000;
  white-space: nowrap;
  -webkit-transition: all 0.1s linear;
  transition: all 0.1s linear; }

/* タブレット */
@media screen and (max-width: 1070px) {
  .modal_content .content_inner {
    padding: 10vw 10vw 8vw; }

  .modal_content .content_inner .arw_prev {
    bottom: 0;
    left: 42%; }

  .modal_content .content_inner .arw_next {
    bottom: 0;
    right: 42%; } }
/* SP */
@media screen and (max-width: 800px) {
  .modal_wrp .modal_content {
    top: 45%;
    padding-left: 5vw;
    padding-right: 5vw; }

  .modal_content .content_inner {
    padding: 15vw 0 10vw; }

  .modal_content .content_inner .pager {
    width: 30px;
    height: 30px; }
    .modal_content .content_inner .pager a {
      width: 30px;
      height: 30px; }
    .modal_content .content_inner .pager a::after {
      width: 8px;
      height: 8px; }

  .modal_content .content_inner .arw_prev {
    bottom: 0;
    left: 30vw; }

  .modal_content .content_inner .arw_next {
    bottom: 0;
    right: 30vw; }

  .modal_content .content_inner .close {
    width: 30px;
    height: 30px;
    top: 0;
    right: 0; }

  .modal_content .content_inner .close::before,
  .modal_content .content_inner .close::after {
    top: 15px;
    right: 0;
    width: 30px;
    height: 2px; }

  .modal_content .content_inner .title {
    top: 1.5vw;
    left: 0;
    font-size: 4vw; } }
/*-------------------------------------------------------------
	modal
-------------------------------------------------------------*/
.modal {
  height: auto;
  max-height: -webkit-calc(100vh - 80px);
  max-height: calc(100vh - 80px);
  position: relative;
  z-index: 1000; }
  .modal .fitimg {
    height: 500px;
    width: auto; }
  .modal img {
    width: 100%;
    height: 100%;
    object-fit: contain; }

/* タブレット */
@media screen and (max-width: 800px) {
  .modal {
    height: auto;
    max-height: -webkit-calc(85vh - 60px);
    max-height: calc(85vh - 60px); }
    .modal .fitimg {
      height: 60vw;
      width: auto; } }
/*-------------------------------------------------------------
	detail
-------------------------------------------------------------*/
/*prev,nextボタンの非表示*/
.modal .btn_wrp .btn_prev,
.modal .btn_wrp .btn_next,
.modal .btn_wrp .btn_close {
  display: none; }

.modal .btn_wrp .btn_prev a,
.modal .btn_wrp .btn_next a {
  text-indent: 100%;
  overflow: hidden;
  white-space: nowrap; }

.modal .btn_wrp .btn_none {
  opacity: 0;
  pointer-events: none !important; }

.modal .btn_wrp .btn_none a {
  pointer-events: none !important; }

/* タブレット */
@media screen and (max-width: 800px) {
  .modal .btn_wrp {
    width: 100%;
    margin-top: 5vw; }

  .modal .btn_wrp .btn a {
    font-size: 4.5vw;
    padding: 4vw 0; }

  .modal .btn_wrp .btn_close {
    width: 60%;
    margin: 0 5%; }

  .modal .btn_wrp .btn_prev,
  .modal .btn_wrp .btn_next {
    width: 15%;
    height: 1%; } }
/*===============================================================
	
	main_visual
	
===============================================================*/
.mainvisual {
  padding-top: 100px;
  position: relative; }
  .mainvisual::before {
    position: absolute;
    content: '';
    top: 0;
    left: 0;
    width: 35vw;
    height: 100%;
    background: #eee;
    margin-left: calc(50% - 50vw);
    z-index: -1; }
  .mainvisual .lead {
    content: '';
    position: absolute;
    bottom: 50px;
    left: 80px;
    font-size: 18px;
    font-weight: bold; }

/* タブレット */
@media screen and (max-width: 1070px) {
  .mainvisual .lead {
    bottom: 45px;
    left: 60px; } }
/* SP */
@media only screen and (max-width: 800px) {
  .mainvisual {
    padding: 15vw 5% 0; }
    .mainvisual::before {
      width: 35vw; }
    .mainvisual .lead {
      bottom: -18vw;
      left: 0;
      font-size: 4vw; } }
/*-------------------------------------------------------------
	スライダー	main_slider
-------------------------------------------------------------*/
.main_slider {
  position: relative; }
  .main_slider .slick_slider {
    opacity: 0;
    transition: opacity .3s linear;
    margin-right: calc(50% - 50vw);
    padding-left: 50px; }
  .main_slider .slick-initialized.slick_slider {
    opacity: 1; }
  .main_slider .slide {
    width: 100%;
    position: relative;
    box-sizing: border-box; }
    .main_slider .slide img {
      width: 100%;
      height: 45vw;
      max-height: 700px;
      object-fit: cover; }

/* タブレット */
/* SP */
@media only screen and (max-width: 800px) {
  .main_slider .slick_slider {
    padding-left: 5vw; }
  .main_slider .slide img {
    height: 50vw; } }
/*-------------------------------------------------------------
	キャプション
-------------------------------------------------------------*/
.main_slider .slider_caption {
  content: '';
  position: absolute;
  bottom: 170px;
  left: 0;
  width: 350px; }
  .main_slider .slider_caption .caption {
    opacity: 0;
    position: relative;
    z-index: 2;
    width: 100%;
    color: #fff;
    padding: 20px;
    font-size: 14px;
    background-color: #333; }
    .main_slider .slider_caption .caption a .caption_inner {
      overflow: hidden;
      color: #fff; }
    .main_slider .slider_caption .caption .concept {
      position: relative;
      font-size: 24px;
      line-height: 1.5;
      font-weight: bold;
      padding-top: 30px; }
      .main_slider .slider_caption .caption .concept::before {
        content: '';
        position: absolute;
        top: 17px;
        left: 17px;
        transform: translateX(-50%);
        width: 30px;
        height: 1px;
        background-color: #fff; }

/* タブレット */
/* SP */
@media only screen and (max-width: 800px) {
  .main_slider .slider_caption {
    left: 0;
    bottom: 5vw;
    width: 55%; }
    .main_slider .slider_caption .caption {
      padding: 3vw;
      font-size: 3.5vw; }
      .main_slider .slider_caption .caption .concept {
        font-size: 4vw;
        line-height: 1.5;
        padding-top: 5vw; }
        .main_slider .slider_caption .caption .concept::before {
          top: 2.5vw;
          left: 3vw;
          width: 5vw; } }
/*-------------------------------------------------------------
	pager_ui	
-------------------------------------------------------------*/
.main_slider .pager_ui {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: flex-end;
  width: 100%;
  padding: 50px 0; }
  .main_slider .pager_ui .progress {
    height: 50px;
    padding-right: 30px;
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: center; }
  .main_slider .pager_ui .progress .bars {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: space-between; }
  .main_slider .pager_ui .progress .bar {
    width: 30px;
    background: #aaa;
    height: 2px;
    position: relative;
    overflow: hidden;
    margin-right: 20px; }
    .main_slider .pager_ui .progress .bar:last-of-type {
      margin-right: 0; }
  .main_slider .pager_ui .progress .bar .progress_bar {
    width: 0%;
    background: #333;
    height: 2px;
    position: absolute;
    left: 0; }

/* タブレット */
/* SP */
@media only screen and (max-width: 800px) {
  .main_slider .pager_ui {
    width: 35%;
    margin: 0 0 0 auto;
    align-items: center;
    flex-direction: column;
    padding: 5vw 0; }
    .main_slider .pager_ui .progress {
      justify-content: flex-end;
      width: 100%;
      height: 5vw;
      padding-right: 0; }
    .main_slider .pager_ui .progress .bars {
      width: 100%;
      justify-content: flex-start;
      padding-left: 8%; }
    .main_slider .pager_ui .progress .bar {
      width: 17%;
      margin-right: 8%; }
      .main_slider .pager_ui .progress .bar:last-of-type {
        margin-right: 8%; }
      .main_slider .pager_ui .progress .bar:nth-of-type(n + 5) {
        margin-top: 3vw; } }
/*-------------------------------------------------------------
	pagers
-------------------------------------------------------------*/
.main_slider .pagers {
  display: flex; }
  .main_slider .pagers .pager a, .main_slider .pagers .pager {
    width: 50px;
    height: 50px;
    z-index: 5; }

/* タブレット */
/* SP */
@media only screen and (max-width: 800px) {
  .main_slider .pagers {
    display: flex;
    justify-content: flex-end; }
    .main_slider .pagers .pager a,
    .main_slider .pagers .pager {
      width: 50px;
      height: 50px; } }
/*-------------------------------------------------------------
	「< >」線の設定
-------------------------------------------------------------*/
.main_slider .pager_ui .pager a {
  display: block;
  overflow: hidden;
  text-indent: -200%;
  position: relative; }
.main_slider .pager_ui .pager a:hover {
  opacity: 0.5; }
.main_slider .pager_ui .pager a:after {
  content: '';
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  margin: auto;
  border-right: solid 2px #333;
  border-bottom: solid 2px #333;
  width: 10px;
  height: 10px;
  transform: rotate(-45deg) translate(-2px, -2px);
  transition: all .3s; }
.main_slider .pager_ui .prev a:after {
  transform: rotate(135deg) translate(-2px, -2px); }

/* タブレット */
/* SP */
/*-------------------------------------------------------------
	スクロールダウン
-------------------------------------------------------------*/
.scroll_down a {
  display: inline-block;
  position: absolute;
  left: 30px;
  bottom: 45px;
  z-index: 2;
  color: #333;
  font-size: 12px;
  font-weight: bold;
  line-height: 1;
  letter-spacing: .2em;
  text-transform: uppercase;
  text-decoration: none;
  writing-mode: vertical-lr;
  transition: all .2s; }
  .scroll_down a::before {
    content: '';
    position: absolute;
    top: 0;
    left: -10px;
    width: 2px;
    height: 70px;
    background: #333; }
  .scroll_down a::after {
    content: '';
    position: absolute;
    top: 66px;
    left: -18px;
    width: 10px;
    height: 2px;
    background: #333;
    transform: rotate(35deg);
    transition: all .3s; }

/* タブレット */
@media screen and (max-width: 1070px) {
  .scroll_down a {
    bottom: 50px; } }
/* SP */
@media only screen and (max-width: 800px) {
  .scroll_down {
    display: none; } }
/*===============================================================
	
	sub_visual
	
===============================================================*/
.sub_visual {
  margin-top: 80px; }
  .sub_visual .sub_visual_inner {
    position: relative;
    padding: 50px 0; }
    .sub_visual .sub_visual_inner::before {
      position: absolute;
      content: '';
      top: 0;
      left: 0;
      width: 90vw;
      height: 100%;
      background: #eee;
      margin-left: calc(50% - 50vw);
      z-index: -1; }

.sub_visual .txt {
  content: '';
  position: absolute;
  top: 50%;
  left: 0;
  transform: translateY(-50%);
  -webkit-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  padding: 15px 50px 20px;
  background-color: #333;
  color: #fff; }
  .sub_visual .txt .title {
    font-size: 40px;
    letter-spacing: .05em; }

.sub_visual .img {
  width: 90%;
  margin: 0 0 0 auto;
  margin-right: -50px; }

/* タブレット以下 */
/* SP */
@media only screen and (max-width: 800px) {
  .sub_visual {
    margin-top: 18vw; }
    .sub_visual .sub_visual_inner {
      padding: 6vw 0; }
      .sub_visual .sub_visual_inner::before {
        width: 95vw; }

  .sub_visual .txt {
    left: 5%;
    padding: 1.5vw 6vw 3vw;
    background-color: #333;
    color: #fff; }
    .sub_visual .txt .title {
      font-size: 6.5vw; }

  .sub_visual .img {
    width: 90%;
    margin: 0 0 0 auto;
    margin-right: 0; } }
/*===============================================================
	
	detail_visual
	
===============================================================*/
.detail_visual {
  margin-top: 80px; }
  .detail_visual .detail_visual_inner {
    padding: 50px 0;
    position: relative; }
    .detail_visual .detail_visual_inner::before {
      position: absolute;
      content: '';
      top: 0;
      left: 0;
      width: 30vw;
      height: 100%;
      background: #eee;
      margin-left: calc(50% - 50vw);
      z-index: -1; }

.detail_visual .txt {
  content: '';
  position: absolute;
  bottom: 100px;
  left: 0;
  padding: 20px 30px 25px;
  background-color: #333;
  color: #fff; }
  .detail_visual .txt .title {
    font-size: 30px;
    letter-spacing: .05em; }

.detail_visual .img {
  width: 100%;
  margin: 0 0 0 auto;
  margin-right: -50px; }
  .detail_visual .img img {
    object-fit: cover;
    max-height: 600px;
    max-width: 1350px; }

/* タブレット以下 */
/* SP */
@media only screen and (max-width: 800px) {
  .detail_visual {
    margin-top: 18vw; }

  .detail_visual .detail_visual_inner {
    padding: 5vw 0 13vw; }
    .detail_visual .detail_visual_inner::before {
      width: 40vw; }

  .detail_visual .txt {
    bottom: 6%;
    left: 5%;
    padding: 2.3vw 4vw 2vw; }
    .detail_visual .txt .title {
      font-size: 5vw; }
    .detail_visual .txt .lead {
      font-size: 3.3vw; }

  .detail_visual .img {
    width: calc(100% - 10vw);
    margin-left: 10vw; }
    .detail_visual .img img {
      height: 50vw; } }
/*-------------------------------------------------------------

	スライダー	gallery_slider

-------------------------------------------------------------*/
.gallery_slider {
  position: relative; }
  .gallery_slider .slick_slider {
    opacity: 0;
    transition: opacity .3s linear;
    margin-right: calc(50% - 50vw); }
  .gallery_slider .slide {
    padding-right: 30px;
    box-sizing: border-box;
    width: 430px;
    transition: all .4s; }
    .gallery_slider .slide:hover {
      opacity: .7; }

/* タブレット */
/* SP */
@media screen and (max-width: 800px) {
  .gallery_slider .slide {
    padding-right: 5vw;
    width: 80vw; } }
/*-------------------------------------------------------------
	画像
-------------------------------------------------------------*/
.gallery_slider .slide .photo {
  border: solid 3px #333;
  height: 225px; }

.gallery_slider .slide .photo img {
  width: 100%;
  height: 100%;
  object-fit: cover; }

/* タブレット以下 */
/* SP向け */
@media screen and (max-width: 800px) {
  .gallery_slider .slide .photo {
    height: 45vw; } }
/*-------------------------------------------------------------
	txt
-------------------------------------------------------------*/
.gallery_slider .slide .txt {
  color: #333;
  padding-top: 30px;
  display: inline-block; }
  .gallery_slider .slide .txt .title {
    font-size: 14px;
    font-weight: normal;
    line-height: 1.4; }
  .gallery_slider .slide .txt .concept {
    font-size: 20px;
    font-weight: bold; }

/* タブレット */
/* SP */
@media screen and (max-width: 800px) {
  .gallery_slider .slide .txt {
    padding-top: 5vw; }
    .gallery_slider .slide .txt .title {
      font-size: 3vw; }
    .gallery_slider .slide .txt .concept {
      font-size: 4vw; } }
/*-------------------------------------------------------------
	.pager_ui
-------------------------------------------------------------*/
.gallery_slider .pager_ui {
  margin-top: 80px;
  width: 100%;
  display: flex;
  justify-content: space-between;
  align-items: center;
  flex-wrap: wrap;
  box-sizing: border-box; }
  .gallery_slider .pager_ui .next {
    margin-left: 30px; }

/* タブレット以下 */
/* SP向け */
@media screen and (max-width: 800px) {
  .gallery_slider .pager_ui {
    margin-top: 8vw; }
    .gallery_slider .pager_ui .next {
      margin-left: 5vw; }
    .gallery_slider .pager_ui .btn {
      margin-top: 10vw; } }
/*-------------------------------------------------------------
	pager
-------------------------------------------------------------*/
.gallery_slider .pager_ui .pager {
  display: inline-block;
  box-sizing: border-box;
  width: 30px;
  height: 30px; }
  .gallery_slider .pager_ui .pager a {
    display: block;
    width: 30px;
    height: 30px;
    border: solid 2px #333;
    overflow: hidden;
    text-indent: -200%;
    position: relative; }
  .gallery_slider .pager_ui .pager a:hover {
    opacity: 0.7; }
  .gallery_slider .pager_ui .pager a:after {
    content: '';
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    margin: auto;
    border-right: solid 2px #333;
    border-bottom: solid 2px #333;
    width: 8px;
    height: 8px;
    transform: rotate(-45deg) translate(-2px, -2px);
    transition: all .3s; }

.gallery_slider .pager_ui .prev a:after {
  transform: rotate(135deg) translate(-2px, -2px); }

/* タブレット */
@media screen and (max-width: 1070px) {
  .gallery_slider .pager_ui .pager a {
    text-indent: -300%; } }
/* SP */
@media screen and (max-width: 800px) {
  .gallery_slider .pager_ui .pager {
    width: 8vw;
    height: 8vw; }
    .gallery_slider .pager_ui .pager a {
      width: 8vw;
      height: 8vw; }
    .gallery_slider .pager_ui .pager a:after {
      width: 2vw;
      height: 2vw; } }
/*-------------------------------------------------------------
	progress
-------------------------------------------------------------*/
.gallery_slider .pager_ui .progress {
  width: 50%;
  padding-right: 12.5px; }
  .gallery_slider .pager_ui .progress .bar {
    width: 100%;
    background: #aaa;
    height: 2px;
    position: relative;
    overflow: hidden;
    display: block;
    background-image: linear-gradient(to right, #333, #333);
    background-repeat: no-repeat;
    background-size: 0 100%;
    transition: background-size .4s ease-in-out; }
  .gallery_slider .pager_ui .progress .bar .progress_bar {
    width: 100%;
    background: #333;
    height: 2px;
    position: absolute;
    left: 0; }

/* タブレット */
@media screen and (max-width: 1070px) {
  .gallery_slider .pager_ui .progress {
    width: 40%; } }
/* SP */
@media screen and (max-width: 800px) {
  .gallery_slider .pager_ui .progress {
    width: 60vw;
    padding: 0; } }
/*===============================================================
	
	ABOUT_US
	
===============================================================*/
.about_wrp {
  display: flex;
  justify-content: space-between;
  align-items: flex-end; }

.about_head {
  width: 30%; }

.about_content {
  width: 70%;
  margin-top: 30px;
  position: relative; }
  .about_content .content_title {
    color: #fff;
    padding: 30px 30px 10px;
    background-image: url("../images/top/about_title_back.svg");
    background-size: cover;
    position: absolute;
    top: -50px;
    left: 40px; }
  .about_content .concept {
    background-color: #eee;
    padding: 70px 40px 50px; }

.about_btns {
  margin-top: 50px;
  font-size: 14px; }

/* タブレット */
/* SP */
@media only screen and (max-width: 800px) {
  #about_us {
    margin-top: 20vw; }

  .about_wrp {
    flex-direction: column;
    position: relative; }
    .about_wrp::before {
      content: '';
      position: absolute;
      top: 5%;
      left: 0;
      background-color: #eee;
      height: 95%;
      width: 100%;
      z-index: -1; }

  .about_head {
    padding: 0 5vw;
    width: 100%;
    display: flex;
    justify-content: space-between; }
    .about_head .headline {
      width: 50%; }

  .about_content {
    width: 100%;
    margin-top: 14vw; }
    .about_content .content_title {
      padding: 5vw 3vw 1.5vw;
      top: -9vw;
      left: 4vw; }
    .about_content .concept {
      padding: 10vw 5vw 5vw; }
      .about_content .concept p {
        line-height: 2.1; }

  .about_btns {
    width: 40%;
    margin-top: 0px; } }
/*===============================================================
	
	TOP GALLERY
	
===============================================================*/
.gallery_content {
  position: relative; }
  .gallery_content::before {
    content: '';
    position: absolute;
    top: -150px;
    right: 0;
    width: 60%;
    height: calc(100% + 200px);
    background: #eee;
    margin-right: calc(50% - 50vw);
    z-index: -1; }

/* タブレット */
@media screen and (max-width: 1070px) {
  .gallery_content::before {
    top: -200px;
    width: 50%;
    height: 170%; } }
/* SP */
@media screen and (max-width: 800px) {
  .gallery_content::before {
    top: -20vw;
    height: 100%;
    background: #eee;
    margin-right: calc(50% - 50vw);
    z-index: -1; } }
/*===============================================================
	
	TOP REPORT
	
===============================================================*/
.report_content {
  position: relative; }
  .report_content::before {
    content: '';
    position: absolute;
    top: -130px;
    left: 0;
    width: calc(50vw + 50%);
    height: calc(100% + 200px);
    background: #eee;
    margin-left: calc(50% - 50vw);
    z-index: -1; }

.report_content .report_list {
  display: flex;
  flex-wrap: wrap;
  margin-right: calc(50% - 46vw);
  max-width: 1235px;
  /* (1400 - 1070) / 2 = 165 , 1400 - 165 */ }
  .report_content .report_list > :not(:nth-child(4n-3)) {
    /*【左右の余白】 最初の列以外の要素を選択 */
    margin-left: 30px; }
  .report_content .report_list .item {
    position: relative;
    width: calc((100% - 30px * 3) / 4);
    /* １行あたりの横幅＝ 全体の横幅(100%) - 余白の合計値(20px*3) ÷ カラム数 */
    overflow: hidden;
    transition: all 0.3s; }
    .report_content .report_list .item:nth-of-type(2n) {
      margin-top: 30px; }
    .report_content .report_list .item .item_img {
      position: relative;
      height: 13vw;
      max-height: 200px;
      width: 100%; }
      .report_content .report_list .item .item_img::before {
        position: absolute;
        top: 0;
        left: 0;
        z-index: 1;
        display: block;
        width: 100%;
        overflow: hidden;
        content: "";
        background-color: rgba(0, 0, 0, 0.8);
        opacity: 0;
        transition: opacity 0.3s; }
      .report_content .report_list .item .item_img img {
        width: 100%;
        height: 100%;
        object-fit: cover;
        transition: filter 0.3s; }
    .report_content .report_list .item:hover {
      transform: translate(0, -10px); }
      .report_content .report_list .item:hover .item_img img::before {
        opacity: 1; }
      .report_content .report_list .item:hover .item_img img {
        filter: invert(20%); }

.item_body {
  position: relative;
  margin-top: -5%;
  width: calc(100% - 20px);
  padding: 0 10px 20px 10px;
  background-color: #fff;
  z-index: 1; }
  .item_body .item_title {
    position: relative;
    top: -15px;
    left: 0;
    display: inline-block;
    padding: 3px 5px;
    background-color: #333;
    color: #fff;
    font-size: 12px;
    font-weight: normal; }
  .item_body .item_title + p {
    margin-top: -10px; }

/* タブレット */
@media screen and (max-width: 1070px) {
  .report_content::before {
    width: calc(50vw + 45%); }

  .report_content .report_list {
    max-width: 924px; }
    .report_content .report_list > :not(:nth-child(4n-3)) {
      margin-left: 30px; }
    .report_content .report_list .item_img {
      height: 13vw; } }
/* SP */
@media screen and (max-width: 800px) {
  .report_content::before {
    top: -25vw;
    height: 102%; }
  .report_content .block + .block {
    margin-top: 15vw; }

  .report_content .report_list {
    margin: 0;
    width: 100%;
    flex-wrap: wrap;
    justify-content: space-between; }
    .report_content .report_list > :not(:nth-child(4n-3)) {
      margin-left: 0; }
    .report_content .report_list .item {
      width: calc((100% - 5vw * 1) / 2); }
      .report_content .report_list .item:nth-of-type(2n) {
        margin-top: 5vw; }
      .report_content .report_list .item .item_img {
        height: 26vw; }

  .item_body {
    width: calc(100% - 3vw);
    padding: 0 3vw 3vw; }
    .item_body .item_title {
      top: -3vw;
      left: 0;
      padding: .5vw 1.5vw;
      font-size: 3vw; }
    .item_body .item_title + p {
      margin-top: -2vw; }
    .item_body .txt {
      font-size: 3.5vw;
      line-height: 1.5; } }
/*===============================================================
	
	ACCESS
	
===============================================================*/
.access_content {
  position: relative;
  padding-bottom: 80px; }
  .access_content::before {
    position: absolute;
    content: '';
    top: -130px;
    left: 0;
    width: 100vw;
    height: 400px;
    background: #eee;
    margin-left: calc(50% - 50vw);
    margin-right: calc(50% - 50vw);
    z-index: -1; }
  .access_content .block + .block {
    margin-top: 40px; }

iframe {
  width: 100%;
  height: 450px; }

.map_info {
  display: flex;
  justify-content: space-between; }
  .map_info .txt_wrp {
    width: 65%; }

/* タブレット */
@media screen and (max-width: 1070px) {
  .map_info .txt_wrp {
    width: 50%; }
  .map_info .btn {
    margin-top: 5vw; } }
/* SP */
@media screen and (max-width: 800px) {
  .access_content {
    padding-bottom: 10vw; }
    .access_content::before {
      top: -19vw;
      height: 50vw; }
    .access_content .block + .block {
      margin-top: 4vw; }

  iframe {
    height: 80vw; }

  .map_info {
    flex-direction: column; }
    .map_info .txt_wrp {
      width: 100%; } }
/*===============================================================
	
	COMPANY
	
===============================================================*/
.company_greetings .sig {
  text-align: right;
  font-size: 14px; }

.company_access {
  display: flex;
  justify-content: space-between;
  align-items: flex-start; }
  .company_access .txt_block {
    width: 32%;
    background-color: #fff;
    padding: 30px; }
    .company_access .txt_block .txt01 {
      padding-bottom: 20px; }
    .company_access .txt_block .txt02 {
      padding-top: 20px;
      position: relative; }
      .company_access .txt_block .txt02::before {
        content: '';
        position: absolute;
        top: 0;
        left: 0;
        border-top: solid 1px #333;
        width: 20px; }
    .company_access .txt_block .btn {
      margin-top: 30px;
      width: 100%; }
  .company_access .img_block {
    width: 65%; }

/* タブレット */
@media screen and (max-width: 1070px) {
  .company_access .txt_block {
    width: 40%; }
  .company_access .img_block {
    width: 57%; } }
/* SP */
@media screen and (max-width: 800px) {
  .company_greetings {
    padding: 3vw 0; }
    .company_greetings .sig {
      margin-top: 3vw;
      font-size: 3.5vw; }

  .company_access {
    flex-direction: column; }
    .company_access .txt_block {
      order: 2;
      width: 100%;
      padding: 5vw;
      margin-top: 5vw; }
      .company_access .txt_block .txt01 {
        padding-bottom: 5vw; }
      .company_access .txt_block .txt02 {
        padding-top: 5vw; }
        .company_access .txt_block .txt02::before {
          width: 5vw; }
      .company_access .txt_block .btn {
        width: 60vw; }
    .company_access .img_block {
      order: 1;
      width: 100%; } }
/*===============================================================
	
	RECRUIT
	
===============================================================*/
.entry_form {
  margin-top: 120px;
  background-color: #eee; }

/* タブレット */
/* SP */
@media screen and (max-width: 800px) {
  .entry_form {
    margin-top: 15vw; } }
/*===============================================================
	
	CONTACT
	
===============================================================*/
.contact_form {
  margin-top: 0px;
  background-color: #eee; }

/* タブレット */
/* SP */
@media screen and (max-width: 800px) {
  .contact_form {
    margin-top: 5vw;
    padding-top: 10vw; } }
/*===============================================================
	
	GALLERY
	
===============================================================*/
.gallery_list {
  display: flex;
  flex-wrap: wrap; }
  .gallery_list .item {
    position: relative;
    width: 47.5%;
    height: 290px;
    border: solid 2px #333;
    overflow: hidden; }
    .gallery_list .item:not(:nth-child(2n)) {
      margin-right: 5%; }
    .gallery_list .item:nth-child(n+3) {
      margin-top: 80px; }
    .gallery_list .item img {
      transition: all .5s;
      width: 100%;
      height: 100%;
      object-fit: cover; }
      .gallery_list .item img:hover {
        transform: scale(1.03, 1.03); }
    .gallery_list .item .item_title {
      position: absolute;
      display: inline-block;
      padding: 3px 5px;
      background-color: #333;
      color: #fff;
      font-size: 12px;
      font-weight: normal; }

.case_studies .item_title {
  bottom: 0;
  left: 0; }

/* タブレット */
@media screen and (max-width: 1070px) {
  .gallery_list .item {
    height: 25vw; } }
/* SP */
@media screen and (max-width: 800px) {
  .gallery_list .item {
    width: 100%;
    height: 50vw; }
    .gallery_list .item:not(:nth-child(2n)) {
      margin-right: 0; }
    .gallery_list .item:nth-child(n+3) {
      margin-top: 0; }
    .gallery_list .item:nth-child(n+2) {
      margin-top: 10vw; }
    .gallery_list .item .item_title {
      font-size: 3vw; }

  .case_studies {
    margin-top: 10vw; }
    .case_studies .item .item_title {
      padding: 1.2vw 2vw .5vw 1.5vw; } }
/*===============================================================
	
	PICKUP_GALLERY
	
===============================================================*/
.pickup_gallery_list {
  display: flex;
  flex-wrap: wrap;
  /* タブレット */
  /* SP */ }
  .pickup_gallery_list .item {
    width: 47.5%; }
    .pickup_gallery_list .item:not(:nth-child(2n)) {
      margin-right: 5%; }
    .pickup_gallery_list .item:nth-child(n+3) {
      margin-top: 80px; }
    .pickup_gallery_list .item .item_inner {
      position: relative;
      height: 290px;
      border: solid 2px #333;
      overflow: hidden; }
    .pickup_gallery_list .item img {
      transition: all .5s;
      width: 100%;
      height: 100%;
      object-fit: cover; }
      .pickup_gallery_list .item img:hover {
        transform: scale(1.03, 1.03); }
    .pickup_gallery_list .item .item_title {
      position: absolute;
      bottom: 0;
      left: 0;
      display: inline-block;
      padding: 3px 5px;
      background-color: #333;
      color: #fff;
      font-size: 12px;
      font-weight: normal; }
    .pickup_gallery_list .item .lead {
      font-size: 17px;
      font-weight: bold;
      margin-top: 10px; }
  @media screen and (max-width: 1070px) {
    .pickup_gallery_list .item:nth-child(n+3) {
      margin-top: 6vw; }
    .pickup_gallery_list .item .item_inner {
      height: 25vw; }
    .pickup_gallery_list .item .lead {
      font-size: 1.7vw;
      margin-top: 1vw; } }
  @media screen and (max-width: 800px) {
    .pickup_gallery_list {
      margin-top: 8vw; }
      .pickup_gallery_list .item {
        width: 100%; }
        .pickup_gallery_list .item .item_inner {
          height: 50vw; }
        .pickup_gallery_list .item:not(:nth-child(2n)) {
          margin-right: 0; }
        .pickup_gallery_list .item:nth-child(n+3) {
          margin-top: 0; }
        .pickup_gallery_list .item:nth-child(n+2) {
          margin-top: 8vw; }
        .pickup_gallery_list .item .item_title {
          font-size: 3vw;
          padding: 1.2vw 2vw .5vw 1.5vw; }
        .pickup_gallery_list .item .lead {
          font-size: 3.6vw;
          margin-top: 2vw; } }

/*===============================================================
	
	GALLERY 部位別ギャラリー
	
===============================================================*/
.grid {
  display: flex;
  flex-wrap: wrap;
  width: calc(100% + 5%);
  margin: -5% -2.5%; }
  .grid .item {
    position: relative;
    width: 45%;
    height: 290px;
    margin: 5% 2.5%;
    border: solid 2px #333;
    overflow: hidden; }
    .grid .item img {
      width: 100%;
      height: 100%;
      object-fit: cover;
      transition: all .5s; }
      .grid .item img:hover {
        transform: scale(1.03, 1.03); }
  .grid .item_title {
    position: absolute;
    display: inline-block;
    padding: 2px 6px 4px 5px;
    background-color: #333;
    color: #fff;
    font-size: 12px;
    font-weight: normal;
    top: 0;
    left: 0; }

.parts_gallery .item_list_pc {
  padding: 50px 0 50px 30px;
  background-color: #eee; }
.parts_gallery .sort_tag {
  display: flex;
  justify-content: flex-start;
  flex-wrap: wrap;
  margin-top: -20px; }
  .parts_gallery .sort_tag li {
    padding: 3px 10px;
    border: solid 1px #333;
    margin-right: 30px;
    margin-top: 20px;
    cursor: pointer;
    transition: all .2s; }
    .parts_gallery .sort_tag li.active {
      background-color: #333; }
      .parts_gallery .sort_tag li.active a {
        color: #fff; }
    .parts_gallery .sort_tag li:hover {
      opacity: 0.8; }
.parts_gallery .item_list_sp {
  display: none; }

/* タブレット */
@media screen and (max-width: 1070px) {
  .grid .item {
    height: 25vw; } }
/* SP */
@media screen and (max-width: 800px) {
  .grid {
    width: calc(100% + 0%);
    margin: -5% 0; }
    .grid .item {
      width: 100%;
      height: 50vw;
      margin: 5% 0; }
    .grid .item_title {
      padding: .5vw 2vw 1.2vw 1.5vw;
      font-size: 12px; }

  .parts_gallery .select_wrp {
    margin-top: 5vw; }
  .parts_gallery .sort_tag {
    display: block;
    margin: 0 0 0 auto; }
  .parts_gallery .item_list_pc {
    display: none; }
  .parts_gallery .item_list_sp {
    display: block; }
  .parts_gallery select {
    -moz-appearance: none;
    -webkit-appearance: none;
    appearance: none;
    border: 0;
    display: inline-block;
    width: 47.5%; } }
/*===============================================================
	
	GALLERY 標準仕様資料
	
===============================================================*/
.document_list.gallery_list {
  flex-wrap: wrap;
  display: flex;
  justify-content: space-between; }

.document_list .item {
  background-color: #eee;
  padding: 30px;
  width: 47.5%;
  height: auto;
  border: none; }

.item::after {
  content: "";
  display: block;
  width: 47.5%;
  height: 0; }

.document_list .date {
  display: flex;
  justify-content: space-between;
  align-items: center; }
  .document_list .date .img {
    width: 45%;
    display: flex;
    justify-content: center;
    align-items: center; }
    .document_list .date .img img {
      width: 50%; }
  .document_list .date .txt {
    width: 45%; }

.document_list .btns {
  display: flex;
  justify-content: space-between;
  margin-top: 50px; }
  .document_list .btns .btn {
    width: 46%; }
  .document_list .btns .btn + .btn {
    margin-top: 0; }

/* タブレット */
@media screen and (max-width: 1070px) {
  .document_list .btns .btn a {
    font-size: 1.5vw; } }
/* SP */
@media screen and (max-width: 800px) {
  .document_list .btns .btn a {
    font-size: 3.5vw; }

  .document_list {
    flex-direction: column;
    margin-top: 8vw; }
    .document_list .item {
      width: 100%;
      padding: 5vw; }
    .document_list .item::after {
      width: 100%; }

  .document_list .btns {
    margin-top: 5vw; }
    .document_list .btns .btn a {
      padding: 2vw 0; } }
/*===============================================================
	
	GALLERY ログイン画面
	
===============================================================*/
.login_area {
  margin-top: 30px;
  padding: 80px 0 60px;
  background-color: #eee; }
  .login_area .headline {
    margin-top: -100px; }
  .login_area form {
    margin-top: 50px; }
    .login_area form .input_login {
      display: block;
      text-align: center; }
      .login_area form .input_login input {
        letter-spacing: .1em;
        width: 400px;
        margin: 0 auto;
        padding: 15px 10px;
        border: solid 2px #333; }
    .login_area form .submit {
      margin-top: 30px; }
      .login_area form .submit input {
        width: 150px; }

.btn_area {
  margin-top: -50px;
  text-align: center; }
  .btn_area .btn {
    margin: 20px auto 0; }

/* タブレット */
/* SP */
@media screen and (max-width: 800px) {
  .login_area {
    margin-top: 10vw;
    padding: 18vw 0 5vw;
    background-color: #eee; }
    .login_area .headline {
      margin-top: -22vw; }
    .login_area form {
      margin-top: 10vw; }
      .login_area form .input_login input {
        line-height: 1.4;
        width: 90%;
        padding: 3vw 2vw; }
      .login_area form .submit {
        margin-top: 5vw; }
        .login_area form .submit input {
          width: 50%; }

  .btn_area {
    margin-top: 0;
    text-align: center; }
    .btn_area .btn {
      margin: 3vw auto 0; } }
/*===============================================================
	
	gallery_タブ
	
===============================================================*/
.gallery_tabs {
  width: calc(100% + 100px);
  margin: 150px -50px 0;
  display: flex;
  justify-content: space-between;
  position: relative;
  flex-wrap: wrap;
  padding: 0 50px 15px;
  border-bottom: solid 2px #333; }

.tab_home {
  position: relative;
  width: 22.5%;
  padding: 10px 0;
  margin-bottom: -17px;
  justify-content: center;
  align-items: center;
  text-align: center;
  border-right: solid 2px #333;
  border-left: solid 2px #333;
  background-color: #f8f8f8;
  z-index: 1; }
  .tab_home .tab_home_roof {
    height: 45px;
    position: relative;
    top: -9px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    width: 100%;
    -weblit-transform: translateY(-100%);
    transform: translateY(-100%); }
  .tab_home .roof {
    bottom: 0;
    border-top: solid 2px #333;
    width: calc(50% + 9px);
    margin: 0 -4.5px; }
  .tab_home .roof_left {
    left: 0;
    -weblit-transform: rotate(-20deg) translateX(0px);
    transform: rotate(-20deg) translateX(0px); }
  .tab_home .roof_right {
    right: 0;
    -weblit-transform: rotate(20deg) translateX(0px);
    transform: rotate(20deg) translateX(0px); }
  .tab_home .tab_title {
    position: absolute;
    top: 50%;
    left: 0;
    right: 0;
    bottom: 0;
    margin: auto;
    -weblit-transform: translateY(-50%);
    transform: translateY(-50%); }

.tab_btn {
  width: 22.5%; }

.tab_btn a {
  display: block;
  text-align: center;
  padding: 12px 0;
  width: 100%;
  color: #333;
  border: 2px solid #333; }

.tab_btn a:hover {
  color: #fff;
  text-decoration: none;
  background-color: #333;
  cursor: pointer; }

/* タブレット */
@media screen and (max-width: 1070px) {
  .tab_home {
    width: 22.5%;
    padding: 10px 0;
    margin-bottom: -17px; }
    .tab_home .tab_home_roof {
      height: 4.2vw;
      top: -7px; } }
/* SP */
@media screen and (max-width: 800px) {
  .gallery_header {
    margin-top: 30vw;
    padding: 0 5vw; }

  .gallery_tabs {
    width: calc(100% + 0px);
    margin: 0;
    border: none;
    align-items: flex-end;
    padding: 0; }

  .tab_home {
    width: 47.5%;
    padding: 2vw 0;
    margin-bottom: 0;
    border-bottom: solid 2px #333; }
    .tab_home .tab_home_roof {
      height: 5vw;
      top: -2.2vw; }
    .tab_home .roof {
      width: calc(50% + 1vw);
      margin: 0 -.5vw; }
    .tab_home .roof_left {
      -weblit-transform: rotate(-15deg) translateX(0px);
      transform: rotate(-15deg) translateX(0px); }
    .tab_home .roof_right {
      -weblit-transform: rotate(15deg) translateX(0px);
      transform: rotate(15deg) translateX(0px); }
    .tab_home .tab_title {
      font-size: 3vw;
      top: 46%;
      -weblit-transform: translateY(-50%);
      transform: translateY(-50%); }

  .tab_btn {
    width: 47.5%;
    font-size: 3vw; }
    .tab_btn:nth-of-type(2) {
      margin-top: 0; }
    .tab_btn:not(:nth-of-type(-n+2)) {
      margin-top: 8vw; }
    .tab_btn a {
      display: block;
      text-align: center;
      padding: 2vw 0;
      width: 100%;
      color: #333;
      border: 2px solid #333; }
    .tab_btn a:hover {
      color: #fff;
      text-decoration: none;
      background-color: #333; } }
/*===============================================================
	
	GALLERY 詳細ページ
	
===============================================================*/
.gallery_detail {
  display: flex;
  justify-content: space-between; }
  .gallery_detail .detail_txt {
    width: 50%; }
    .gallery_detail .detail_txt .title {
      font-size: 20px; }
    .gallery_detail .detail_txt .title + p,
    .gallery_detail .detail_txt p + p {
      margin-top: 20px; }
  .gallery_detail .detail_info {
    max-width: 30%; }

.gallery_detail .detail_info .info_box {
  background-color: #eee;
  padding: 20px; }
.gallery_detail .detail_info .info {
  margin-top: 5px; }
  .gallery_detail .detail_info .info:first-of-type {
    margin-top: 0; }

/*-------------------------------------------------------------
	詳細ページ_スライダー
-------------------------------------------------------------*/
.detail_gallery_slider {
  margin-top: -105px;
  padding: 90px 0 80px;
  position: relative; }
  .detail_gallery_slider::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 90vw;
    height: 100%;
    background: #eee;
    margin-left: calc(50% - 50vw);
    z-index: -1; }
  .detail_gallery_slider .gallery_slider .slide {
    width: auto; }
  .detail_gallery_slider .gallery_slider .slide a {
    display: block; }
  .detail_gallery_slider .gallery_slider .slide .photo {
    width: 100%;
    height: 400px; }
  .detail_gallery_slider .gallery_slider .slide .photo img {
    width: auto;
    height: 100%;
    object-fit: fill; }

/* タブレット */
/* SP */
@media screen and (max-width: 800px) {
  .gallery_detail {
    flex-direction: column;
    padding: 5vw 0; }
    .gallery_detail .detail_txt {
      width: 100%; }
      .gallery_detail .detail_txt .title {
        font-size: 4.5vw; }
      .gallery_detail .detail_txt .title + p,
      .gallery_detail .detail_txt p + p {
        margin-top: 5vw; }

  .gallery_detail .detail_info {
    width: 100%;
    max-width: 100%; }
    .gallery_detail .detail_info .info_box {
      margin-top: 5vw;
      background-color: #eee;
      padding: 3vw 3vw;
      display: flex;
      justify-content: space-between;
      flex-wrap: wrap;
      align-items: center; }
    .gallery_detail .detail_info .info {
      width: 100%;
      margin-top: 1vw;
      padding-left: 1em;
      text-indent: -1em; }
      .gallery_detail .detail_info .info::before {
        content: '・'; }

  .detail_gallery_slider {
    margin-top: -13vw;
    padding: 15vw 0 10vw; }
    .detail_gallery_slider::before {
      width: 90vw;
      height: 100%;
      margin-left: calc(50% - 50vw); }
    .detail_gallery_slider .gallery_slider .slide .photo {
      height: 44vw; } }
/*===============================================================
	
	プライバシーポリシー
	
===============================================================*/
.privacy_policy_list {
  margin-top: 30px;
  padding: 40px 50px;
  background-color: #eee; }
  .privacy_policy_list li {
    margin-top: 15px; }
    .privacy_policy_list li:first-of-type {
      margin-top: 0; }

/* タブレット */
/* SP */
@media screen and (max-width: 800px) {
  .privacy_policy {
    margin-top: 5vw; }

  .privacy_policy_list {
    margin-top: 6vw;
    padding: 5vw;
    background-color: #eee; }
    .privacy_policy_list li {
      margin-top: 3vw; } }
/*===============================================================
	
	サイトマップ
	
===============================================================*/
.sitemap_item_wrp .sites {
  margin-top: 30px; }
  .sitemap_item_wrp .sites .headline {
    padding: 20px;
    background-color: #eee; }
.sitemap_item_wrp .item_wrp.gallery_sites .item {
  width: 23%; }
.sitemap_item_wrp .item_wrp.gallery_sites .gallery {
  width: 30%; }
.sitemap_item_wrp .item_wrp {
  display: flex;
  justify-content: space-between;
  margin-top: 20px;
  padding-left: 2px; }
  .sitemap_item_wrp .item_wrp .item {
    width: 100%;
    border-left: solid 1px #333; }
    .sitemap_item_wrp .item_wrp .item a, .sitemap_item_wrp .item_wrp .item span {
      display: block;
      padding: 20px; }
    .sitemap_item_wrp .item_wrp .item a:hover {
      background-color: rgba(238, 238, 238, 0.7); }
    .sitemap_item_wrp .item_wrp .item .item_list a {
      padding-left: 40px; }
    .sitemap_item_wrp .item_wrp .item .child::before {
      display: inline-block;
      margin-right: 10px;
      content: "";
      width: 14px;
      height: 6px;
      border-left: 1px solid #aaa;
      border-bottom: 1px solid #aaa; }
    .sitemap_item_wrp .item_wrp .item .child.top::before {
      display: none; }

/* タブレット */
/* SP */
@media screen and (max-width: 800px) {
  .sitemap_item_wrp .sites {
    margin-top: 10vw; }
    .sitemap_item_wrp .sites:first-of-type {
      margin-top: 5vw; }
    .sitemap_item_wrp .sites .headline {
      padding: 3vw; }
  .sitemap_item_wrp .item_wrp.gallery_sites .item {
    width: 100%; }
  .sitemap_item_wrp .item_wrp.gallery_sites .gallery {
    width: 100%; }
  .sitemap_item_wrp .item_wrp {
    flex-direction: column;
    margin-top: 5vw; }
    .sitemap_item_wrp .item_wrp .item {
      border-left: none; }
      .sitemap_item_wrp .item_wrp .item a,
      .sitemap_item_wrp .item_wrp .item span {
        position: relative;
        display: block;
        padding: 20px;
        border-bottom: solid 1px #aaa; }
      .sitemap_item_wrp .item_wrp .item a:hover {
        background-color: rgba(238, 238, 238, 0.7); }
      .sitemap_item_wrp .item_wrp .item a::after {
        content: '';
        position: absolute;
        top: 40%;
        right: 20px;
        transform: translateY(-50%);
        -webkit-transform: translateY(-50%);
        -ms-transform: translateY(-50%);
        width: 5px;
        height: 5px;
        border-top: solid 1px #333;
        border-right: solid 1px #333;
        transform: rotate(45deg); }
      .sitemap_item_wrp .item_wrp .item .item_list a {
        padding-left: 40px;
        border-bottom: none;
        background-color: rgba(238, 238, 238, 0.7);
        border-bottom: solid 1px #fff; }
      .sitemap_item_wrp .item_wrp .item .child::before {
        display: inline-block;
        margin-right: 10px;
        content: "";
        width: 14px;
        height: 6px;
        border-left: 1px solid #aaa;
        border-bottom: 1px solid #aaa; }
      .sitemap_item_wrp .item_wrp .item .child.top::before {
        display: none; } }
/*===============================================================
	
	REPORT
	
===============================================================*/
.report {
  position: relative; }
  .report .report_list {
    display: flex;
    flex-wrap: wrap;
    width: calc(100% + 30px);
    max-width: 1400px;
    margin: -80px -15px 0; }
    .report .report_list .item {
      position: relative;
      width: calc((100% - 40px * 3) / 4);
      transition: all 0.3s;
      margin: 80px 15px 0; }
      .report .report_list .item:hover .item_img img::before {
        opacity: 1; }
      .report .report_list .item:hover .item_img img {
        filter: invert(20%); }
      .report .report_list .item .item_img {
        position: relative;
        height: 150px;
        overflow: hidden; }
        .report .report_list .item .item_img::before {
          position: absolute;
          top: 0;
          left: 0;
          z-index: 1;
          display: block;
          width: 100%;
          content: "";
          background-color: rgba(0, 0, 0, 0.8);
          opacity: 0;
          transition: opacity 0.3s; }
        .report .report_list .item .item_img img {
          transition: filter 0.3s;
          width: 100%;
          height: 100%;
          object-fit: cover; }
      .report .report_list .item .lead {
        font-weight: normal; }

.sort {
  padding: 30px 0;
  border-bottom: solid 1px #333;
  display: flex;
  justify-content: space-between;
  align-items: center; }
  .sort .choose {
    margin-left: 20px; }
  .sort .select_btn {
    position: relative;
    display: flex;
    align-items: center;
    width: 50%;
    border: none; }
    .sort .select_btn::after {
      position: absolute;
      top: 50%;
      right: 20px;
      transform: translateY(-50%) rotate(135deg);
      -webkit-transform: translateY(-50%) rotate(135deg);
      -ms-transform: translateY(-50%) rotate(135deg);
      width: 5px;
      height: 5px;
      border-top: solid 2px #333;
      border-right: solid 2px #333; }
    .sort .select_btn .title {
      width: 60px; }
    .sort .select_btn .select_wrp {
      width: calc(100% - 60px); }
    .sort .select_btn .report_list_btn {
      width: 100%;
      font-size: 14px; }
  .sort .radio {
    display: flex;
    justify-content: space-between;
    align-items: center; }
    .sort .radio .title {
      display: flex;
      justify-content: space-between;
      align-items: center; }
      .sort .radio .title::after {
        content: '';
        width: 1px;
        height: 18px;
        margin-left: 20px;
        background-color: #333; }
    .sort .radio input[type=radio] {
      display: none; }
    .sort .radio label {
      box-sizing: border-box;
      cursor: pointer;
      display: inline-block;
      padding: 5px 30px 5px 30px;
      position: relative;
      width: auto; }
      .sort .radio label:last-of-type {
        padding-right: 0; }
    .sort .radio label::before {
      content: '';
      position: absolute;
      top: 50%;
      left: 0;
      transform: translateY(-50%);
      -webkit-transform: translateY(-50%);
      -ms-transform: translateY(-50%);
      width: 14px;
      height: 14px;
      background-color: #fff;
      border: 2px solid #333; }
    .sort .radio label::after {
      content: '';
      position: absolute;
      top: 50%;
      left: 4px;
      transform: translateY(-50%);
      -webkit-transform: translateY(-50%);
      -ms-transform: translateY(-50%);
      width: 10px;
      height: 10px;
      background-color: #333;
      opacity: 0; }
    .sort .radio input[type=radio]:checked + label::after {
      opacity: 1; }
  .sort .choose {
    display: inline-block; }

/* タブレット */
@media screen and (max-width: 1070px) {
  .report .report_list .item .item_img {
    height: 13vw; } }
/* SP */
@media screen and (max-width: 800px) {
  .report .report_list {
    width: calc(100% + 5vw);
    margin: -10vw -2.5vw 0; }
    .report .report_list .item {
      width: calc((100% - 10vw * 1) / 2);
      margin: 10vw 2.5vw 0; }
      .report .report_list .item .item_img {
        height: 26vw; }
  .report .item_body {
    width: calc(100% - 3vw);
    padding: 0 3vw 3vw; }
    .report .item_body .item_title {
      top: -3vw;
      left: 0;
      padding: .5vw 1.5vw;
      font-size: 3vw; }
    .report .item_body .txt {
      font-size: 3.5vw;
      line-height: 1.5; }

  .sort {
    padding: 5vw 0 10vw;
    flex-direction: column; }
    .sort .choose {
      margin-left: 5vw; }
    .sort .select_btn {
      width: 90%; }
      .sort .select_btn::after {
        right: 5vw;
        width: 1.5vw;
        height: 1.5vw; }
      .sort .select_btn .title {
        width: 15vw; }
      .sort .select_btn .select_wrp {
        width: calc(100% - 15vw); }
      .sort .select_btn .report_list_btn {
        font-size: 3.5vw; }
    .sort .radio {
      margin-top: 10vw; }
      .sort .radio .title::after {
        margin-left: 5vw; }
      .sort .radio label {
        padding: 0 5vw 0 8vw;
        margin-top: 0; }
      .sort .radio label::before {
        left: 0; }
      .sort .radio label::after {
        left: 4px; } }
/*===============================================================
	
	REPORT_詳細ページ
	
===============================================================*/
.report_detail {
  position: relative;
  margin-top: 80px;
  padding: 50px;
  background: top center #eee;
  /*	既存のslick_css設定変更	*/ }
  .report_detail .headline {
    content: '';
    position: absolute;
    top: -25px;
    left: 50px; }
  .report_detail .slick_slider {
    width: 100%;
    margin: 0 auto;
    padding: 20px 0; }
    .report_detail .slick_slider .slide .photo img {
      position: relative;
      width: auto;
      height: 500px;
      left: 50%;
      -webkit-transform: translateX(-50%);
      transform: translateX(-50%); }
  .report_detail .slick_slider .slick-slide {
    transition: all .5s;
    opacity: 0; }
  .report_detail .slick_slider .slick-slide.slick-center {
    opacity: 1; }

.report_status {
  margin-top: 30px; }
  .report_status .status_list {
    margin-top: 30px; }
    .report_status .status_list dl {
      display: flex;
      align-items: center;
      padding: 10px 0; }
    .report_status .status_list dt {
      font-weight: bold;
      width: 150px; }
    .report_status .status_list dd, .report_status .status_list .report_progress {
      width: calc(100% - 150px); }
    .report_status .status_list .report_progress {
      display: flex;
      justify-content: space-between;
      align-items: center; }
      .report_status .status_list .report_progress dd {
        width: 10%; }
      .report_status .status_list .report_progress dd + dd {
        width: 85%; }
    .report_status .status_list progress {
      width: 100%;
      height: 4px;
      margin-bottom: 5px;
      -webkit-appearance: none; }
    .report_status .status_list ::-webkit-progress-bar {
      background-color: #eee; }
    .report_status .status_list ::-webkit-progress-value {
      background-color: #666; }

/* タブレット */
/* SP */
@media screen and (max-width: 800px) {
  .report_detail {
    margin-top: 23vw;
    padding: 12vw 5vw 10vw;
    width: 100vw;
    left: 50%;
    -webkit-transform: translateX(-50%);
    transform: translateX(-50%); }
    .report_detail .headline {
      top: -5vw;
      left: 5vw; }
    .report_detail .slick_slider .slide .photo img {
      height: 50vw;
      left: 50%;
      -webkit-transform: translateX(-50%);
      transform: translateX(-50%); }

  .report_status .status_list {
    margin-top: 5vw; }
    .report_status .status_list dl {
      padding: 1vw 0; }
    .report_status .status_list dt {
      width: 30vw; }
    .report_status .status_list dd, .report_status .status_list .report_progress {
      width: calc(100% - 30vw); }
    .report_status .status_list .report_progress {
      flex-direction: column; }
      .report_status .status_list .report_progress dd {
        width: 100%;
        margin: 0 0 -1vw; }
      .report_status .status_list .report_progress dd + dd {
        width: 100%;
        margin: -1vw 0 0; }
    .report_status .status_list progress {
      width: 100%;
      height: 4px;
      margin-bottom: 0; } }
.fadeIn {
  animation-name: fadeInAnime;
  animation-duration: 1s;
  animation-fill-mode: forwards;
  opacity: 0; }

@keyframes fadeInAnime {
  from {
    opacity: 0;
    transform: translateY(100px); }
  to {
    opacity: 1; } }
/* アニメーションスタートの遅延時間を決めるCSS*/
.delay_time05 {
  animation-delay: 0.5s; }

.delay_time1 {
  animation-delay: 1s; }

.delay_time15 {
  animation-delay: 1.5s; }

.delay_time2 {
  animation-delay: 2s; }

.delay_time25 {
  animation-delay: 2.5s; }

/* アニメーション自体が変化する時間を決めるCSS*/
.change_time05 {
  animation-duration: 0.5s; }

.change_time1 {
  animation-duration: 1s; }

.change_time15 {
  animation-duration: 1.5s; }

.change_time2 {
  animation-duration: 2s; }

.change_time25 {
  animation-duration: 2.5s; }

/*===============================================================
	
	404ページ
	
===============================================================*/
.notfound_area {
  margin-top: 130px;
  padding: 80px 0 60px;
  background-color: #eee; }
  .notfound_area .headline {
    margin-top: -100px; }
  .notfound_area .title + .title {
    margin-top: 50px; }
  .notfound_area .section_lead {
    margin-top: 15px; }

.notfound_area .box {
  width: auto;
  max-width: 380px;
  padding: 30px;
  margin: 0 auto;
  margin-top: 30px;
  background: #fff;
  -webkit-box-sizing: border-box;
  box-sizing: border-box; }
  .notfound_area .box li {
    font-size: 14px;
    line-height: 1.6;
    text-align: left;
    text-indent: -1em;
    padding-left: 1em; }
    .notfound_area .box li + li {
      margin-top: 5px; }

/* タブレット */
/* SP */
@media screen and (max-width: 800px) {
  .notfound_area {
    margin-top: 30vw;
    padding: 18vw 0 5vw; }
    .notfound_area .headline {
      margin-top: -22vw; }
    .notfound_area .title + .title {
      margin-top: 5vw; }
    .notfound_area .section_lead {
      margin-top: 1vw; }

  .notfound_area .box {
    max-width: 100%;
    width: 90%;
    margin: 0 auto;
    padding: 4vw;
    margin-top: 5vw; }
    .notfound_area .box li {
      font-size: 3vw; }
      .notfound_area .box li + li {
        margin-top: 2vw; }

  .notfound .content + .content {
    margin-top: 8vw; } }
/*===============================================================
	mixinテスト
===============================================================*/
.under_line {
  background: linear-gradient(transparent 70%, rgba(255, 0, 0, 0.3) 0%);
  display: inline; }

.under_marker {
  background: linear-gradient(transparent 0%, #ff0 0%);
  display: inline; }

.btn_link {
  width: 300px;
  margin-left: auto;
  margin-right: auto;
  border: solid 1px #000; }
  .btn_link a {
    display: block;
    text-align: center;
    background: #fff;
    color: #000;
    transition: all 0.3s;
    padding: 20px;
    text-decoration: none; }
    @media screen and (max-width: 800px) {
      .btn_link a {
        padding: 3vw; } }
  .btn_link a:hover {
    background: #000;
    color: #fff;
    text-decoration: none; }
  .btn_link a {
    position: relative; }
    .btn_link a::after {
      content: '';
      position: absolute;
      top: 0;
      bottom: 0;
      margin: auto;
      border: solid 1px #000;
      width: 6px;
      height: 6px;
      border-top: none;
      border-left: none;
      transition: all 0.3s;
      right: 10px;
      transform: rotate(-45deg) translate(-1px, -1px); }
    .btn_link a:hover::after {
      border: solid 1px #fff;
      border-top: none;
      border-left: none; }
  @media screen and (max-width: 800px) {
    .btn_link {
      width: 80%; } }

.btn_sankaku {
  width: 300px;
  margin-left: auto;
  margin-right: auto;
  border: solid 1px #000; }
  .btn_sankaku a {
    display: block;
    text-align: center;
    background: #000;
    color: #fff;
    transition: all 0.3s;
    padding: 20px;
    text-decoration: none; }
    @media screen and (max-width: 800px) {
      .btn_sankaku a {
        padding: 3vw; } }
  .btn_sankaku a:hover {
    background: #fff;
    color: #000;
    text-decoration: none; }
  .btn_sankaku a {
    position: relative; }
    .btn_sankaku a::after {
      content: '';
      position: absolute;
      top: 0;
      bottom: 0;
      margin: auto;
      transition: all 0.3s;
      width: 0;
      height: 0;
      border-style: solid;
      left: 10px;
      border-width: 5px 8px 5px 0;
      border-color: transparent #fff transparent transparent; }
    .btn_sankaku a:hover::after {
      border-width: 5px 8px 5px 0;
      border-color: transparent #000 transparent transparent; }
  @media screen and (max-width: 800px) {
    .btn_sankaku {
      width: 80%; } }

.bg_slash {
  background-image: linear-gradient(-45deg, #fff 25%, #eee 25%, #eee 50%, #fff 50%, #fff 75%, #eee 75%, #eee);
  background-size: 5px 5px;
  padding: 30px; }

.bg_grade {
  background: #FF6EC9;
  background: -webkit-linear-gradient(right, #FF6EC9 0%, #5DCAFC 100%);
  background: linear-gradient(to right, #FF6EC9 0%, #5DCAFC 100%);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#FF6EC9', endColorstr=' #5DCAFC', GradientType=1);
  padding: 30px; }