@charset "UTF-8";
a, abbr, acronym, address, applet, article, aside, audio, b, big, blockquote, body, canvas, caption, cite, code, dd, del, details, dfn, div, dl, dt, em, embed, fieldset, figcaption, figure, footer, form, h1, h2, h3, h4, h5, h6, header, hgroup, html, i, iframe, img, ins, kbd, label, legend, li, mark, menu, nav, object, ol, output, p, pre, q, ruby, s, samp, section, small, strong, sub, summary, sup, table, tbody, td, tfoot, th, thead, time, tr, ul, var, video {
  margin: 0;
  padding: 0;
  border: 0;
  outline: 0;
  font-size: 100%;
  font-style: normal;
  font-weight: normal;
  vertical-align: baseline;
  background: transparent
}
span {
  margin: 0;
  padding: 0;
  border: 0;
  outline: 0;
  font-size: 100%;
  vertical-align: baseline;
  background: transparent
}
article, aside, details, figcaption, figure, footer, group, header, menu, nav, section {
  display: block
}
ol, ul {
  list-style: none
}
blockquote, q {
  quotes: none
}
blockquote:after, blockquote:before, q:after, q:before {
  content: '';
  content: none
}
table {
  border-collapse: collapse;
  border-spacing: 0
}
input, select {
  vertical-align: middle
}
* {
  box-sizing: border-box
}
img, picture {
  max-width: 100%;
  height: auto;
  display: block;
  margin: 0 auto
}
html {
  font-size: 62.5%
}
body {
  color: #000;
  font-size: 1.3rem;
  font-family: "Noto Sans JP", "Hiragino Kaku Gothic ProN", "ヒラギノ角ゴ Pro W3", "游ゴシック体", "Yu Gothic", YuGothic, "メイリオ", Meiryo, sans-serif;
  line-height: 2.2;
  -webkit-text-size-adjust: 100%
}
body a {
  color: #000
}
body a:active, body a:hover, body a:link, body a:visited {
  text-decoration: none
}
@media only screen and (min-width:768px) {
  body {
    color: #000;
    font-size: 1.6rem;
    line-height: 1.8
  }
}
@font-face {
  font-family: "josefinsans";
  src: url("../fonts/josefinsans-regular-webfont.woff2") format("woff2");
  src: url("../fonts/josefinsans-regular-webfont.woff") format("woff");
  font-weight: normal
}
@font-face {
  font-family: "josefinsans";
  src: url("../fonts/josefinsans-bold-webfont.woff2") format("woff2");
  src: url("../fonts/josefinsans-bold-webfont.woff") format("woff");
  font-weight: bold
}
#page {
  width: 100%
}
@media only screen and (min-width:768px) {
  #page {
    min-width: 1200px
  }
}
#header .con_header {
  position: fixed;
  left: 0;
  top: 0;
  width: 100%;
  z-index: 100
}
#header .con_header .box_header h1 {
  width: 110px;
  position: absolute;
  z-index: 50;
  left: 8px;
  top: 10px
}
#header .con_header .box_header h1 a {
  display: block
}
#header .con_header .box_header h1 a img {
  margin: 0
}
#header .con_header .box_header h1 a svg {
  display: block;
  width: 100%;
  max-width: 100%
}
#homepage #header .con_header .box_header h1 a svg {
  -webkit-transition: fill 200ms ease-in-out 0ms;
  -moz-transition: fill 200ms ease-in-out 0ms;
  -ms-transition: fill 200ms ease-in-out 0ms;
  -o-transition: fill 200ms ease-in-out 0ms;
  transition-property: fill;
  transition-duration: 200ms;
  transition-timing-function: ease-in-out;
  transition-delay: 0ms
}
#homepage.color #header .con_header .box_header h1 a svg {
  fill: #fff
}
#homepage.color #page.cdlist #header .con_header .box_header h1 a svg, #homepage.color #page.menu #header .con_header .box_header h1 a svg {
  fill: #000
}
#header .con_header .box_header h1 a span {
  height: 0;
  overflow: hidden;
  display: block
}
#header .con_header .box_header .btn_menu {
  position: absolute;
  right: 0;
  top: 0;
  width: 56px;
  height: 56px;
  overflow: hidden;
  z-index: 50
}
#header .con_header .box_header .btn_menu a {
  display: block;
  width: 56px;
  height: 56px
}
#page.menu #header .con_header .box_header .btn_menu a .ic .t {
  margin-top: 0;
  -webkit-transform: rotate(45deg);
  -moz-transform: rotate(45deg);
  -ms-transform: rotate(45deg);
  -o-transform: rotate(45deg);
  transform: rotate(45deg)
}
#page.menu #header .con_header .box_header .btn_menu a .ic .b {
  margin-top: 0;
  -webkit-transform: rotate(-45deg);
  -moz-transform: rotate(-45deg);
  -ms-transform: rotate(-45deg);
  -o-transform: rotate(-45deg);
  transform: rotate(-45deg)
}
#page.menu #header .con_header .box_header .btn_menu a .ic .m {
  width: 0
}
#homepage.color #page.cdlist #header .con_header .box_header .btn_menu a .ic .b, #homepage.color #page.cdlist #header .con_header .box_header .btn_menu a .ic .m, #homepage.color #page.cdlist #header .con_header .box_header .btn_menu a .ic .t, #homepage.color #page.menu #header .con_header .box_header .btn_menu a .ic .b, #homepage.color #page.menu #header .con_header .box_header .btn_menu a .ic .m, #homepage.color #page.menu #header .con_header .box_header .btn_menu a .ic .t {
  background: #000
}
#header .con_header .box_header .btn_menu a .ic {
  position: relative;
  top: 20px;
  width: 22px;
  height: 16px;
  margin: 0 auto;
  display: block
}
#header .con_header .box_header .btn_menu a .ic .b, #header .con_header .box_header .btn_menu a .ic .m, #header .con_header .box_header .btn_menu a .ic .t {
  height: 1px;
  width: 22px;
  background: #000;
  position: absolute;
  left: 0;
  top: 50%;
  -webkit-transition: all 200ms ease-in-out 0ms;
  -moz-transition: all 200ms ease-in-out 0ms;
  -ms-transition: all 200ms ease-in-out 0ms;
  -o-transition: all 200ms ease-in-out 0ms;
  transition-property: all;
  transition-duration: 200ms;
  transition-timing-function: ease-in-out;
  transition-delay: 0ms
}
#homepage.color #header .con_header .box_header .btn_menu a .ic .b, #homepage.color #header .con_header .box_header .btn_menu a .ic .m, #homepage.color #header .con_header .box_header .btn_menu a .ic .t {
  background: #fff
}
#header .con_header .box_header .btn_menu a .ic .t {
  margin-top: -7px
}
#header .con_header .box_header .btn_menu a .ic .b {
  margin-top: 7px
}
#header .con_header .box_header .btn_menu a .txt {
  display: block;
  text-align: center;
  font-size: 1rem;
  line-height: 1
}
#header .con_header #menu {
  background: #dedede;
  position: fixed;
  top: 0;
  right: 0;
  z-index: 10;
  width: 100vw;
  height: 100%;
  -webkit-transform: translateY(-100%);
  -moz-transform: translateY(-100%);
  -ms-transform: translateY(-100%);
  -o-transform: translateY(-100%);
  transform: translateY(-100%);
  -webkit-transition: all 400ms ease-in-out 0ms;
  -moz-transition: all 400ms ease-in-out 0ms;
  -ms-transition: all 400ms ease-in-out 0ms;
  -o-transition: all 400ms ease-in-out 0ms;
  transition-property: all;
  transition-duration: 400ms;
  transition-timing-function: ease-in-out;
  transition-delay: 0ms
}
#page.menu #header .con_header #menu {
  -webkit-transform: translateY(0);
  -moz-transform: translateY(0);
  -ms-transform: translateY(0);
  -o-transform: translateY(0);
  transform: translateY(0)
}
#header .con_header #menu ul {
  padding: 60px 0;
  display: -webkit-flex;
  -webkit-flex-direction: column;
  -webkit-align-items: center;
  -webkit-justify-content: center;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  width: 100%;
}
#header .con_header #menu ul li {
    margin-top: 0;
    border-bottom: 1px solid #cecece;
    width: 100%;
    text-align: center;
    font-size: 12px;
}
#header .con_header #menu ul li:first-child {
  margin-top: 0
}
#header .con_header #menu ul li:last-child a:after {
  display: none
}
#header .con_header #menu ul li a {
  display: block;
  padding: 10px 0;
  font-size: 3.0vw;
  letter-spacing: 0.2ex;
  color: #000;
  white-space: nowrap;
  -webkit-font-feature-settings: "palt";
  -moz-font-feature-settings: "palt";
  font-feature-settings: "palt";
  position: relative
}
#header .con_header #menu ul li a:after {
  content: "";
  display: block;
  width: 10vw;
  height: 1px;
  position: absolute;
  bottom: -10px;
  left: 50%;
  background: none;
  -webkit-transform: translateX(-50%);
  -moz-transform: translateX(-50%);
  -ms-transform: translateX(-50%);
  -o-transform: translateX(-50%);
  transform: translateX(-50%)
}
#header .con_header #menu ul li a i, #header .con_header #menu ul li a span, #header .con_header #menu ul li a svg {
  display: inline-block
}
#header .con_header #menu ul li a i, #header .con_header #menu ul li a svg {
  width: 3.0vw;
  margin-left: 5px
}
@media only screen and (min-width:768px) {
  #about #header .con_header #menu ul li.nav_abo a:after, #contact #header .con_header #menu ul li.nav_con a:after, #flow #header .con_header #menu ul li.nav_flo a:after, #homepage #header .con_header #menu ul li.nav_dir a:after, #homepage #header .con_header #menu ul li.nav_hom a:after, #service #header .con_header #menu ul li.nav_ser a:after {
    width: 80px
  }
  #header .con_header {
    min-width: 1200px
  }
  #header .con_header .box_header {
    padding: 0;
    background: none
  }
  #header .con_header .box_header h1 {
    width: 144px;
    left: 22px;
    top: 13px
  }
  #header .con_header .box_header h1 a {
    -webkit-transition: all 200ms ease-in-out 0ms;
    -moz-transition: all 200ms ease-in-out 0ms;
    -ms-transition: all 200ms ease-in-out 0ms;
    -o-transition: all 200ms ease-in-out 0ms;
    transition-property: all;
    transition-duration: 200ms;
    transition-timing-function: ease-in-out;
    transition-delay: 0ms
  }
  #header .con_header .box_header h1 a:hover {
    opacity: 0.7
  }
  #header .con_header .box_header h1 a img {
    height: auto
  }
  #homepage.color #header .con_header .box_header h1 a svg {
    fill: #000
  }
  #header .con_header .box_header .btn_menu {
    display: none !important
  }
  #header .con_header #menu {
    display: block !important;
    height: auto;
    width: auto;
    background: none;
    top: 10px;
    right: 30px;
    -webkit-transform: translateY(0);
    -moz-transform: translateY(0);
    -ms-transform: translateY(0);
    -o-transform: translateY(0);
    transform: translateY(0)
  }
  #page.menu #header .con_header #menu {
    -webkit-transform: translateY(none);
    -moz-transform: translateY(none);
    -ms-transform: translateY(none);
    -o-transform: translateY(none);
    transform: translateY(none)
  }
  #header .con_header #menu ul {
    -webkit-justify-content: flex-end;
    -webkit-flex-direction: row;
    justify-content: flex-end;
    flex-direction: row;
    background: none;
    padding: 0;
    height: auto;
    overflow: visible;
    height: auto;
    width: auto
  }
  #header .con_header #menu ul li {
    margin: 0 0 0 30px ;
	border-bottom: none;
  }
  #header .con_header #menu ul li:first-child {
    margin: 0 ;
  }
  #header .con_header #menu ul li:last-child a:after {
    display: block ; 
  }
  #header .con_header #menu ul li a {
    font-size: 1.5rem ;
  }
  #homepage #header .con_header #menu ul li a {
    -webkit-transition: color 200ms ease-in-out 0ms;
    -moz-transition: color 200ms ease-in-out 0ms;
    -ms-transition: color 200ms ease-in-out 0ms;
    -o-transition: color 200ms ease-in-out 0ms;
    transition-property: color;
    transition-duration: 200ms;
    transition-timing-function: ease-in-out;
    transition-delay: 0ms
  }
  #homepage #header .con_header #menu ul li a svg {
    -webkit-transition: fill 200ms ease-in-out 0ms;
    -moz-transition: fill 200ms ease-in-out 0ms;
    -ms-transition: fill 200ms ease-in-out 0ms;
    -o-transition: fill 200ms ease-in-out 0ms;
    transition-property: fill;
    transition-duration: 200ms;
    transition-timing-function: ease-in-out;
    transition-delay: 0ms
  }
  #homepage.color #header .con_header #menu ul li a {
    color: #fff
  }
  #homepage.color #header .con_header #menu ul li a svg {
    fill: #fff
  }
  #header .con_header #menu ul li a:after {
    width: 0;
    height: 2px;
    bottom: 0;
    -webkit-transition: width 200ms ease-in-out 0ms;
    -moz-transition: width 200ms ease-in-out 0ms;
    -ms-transition: width 200ms ease-in-out 0ms;
    -o-transition: width 200ms ease-in-out 0ms;
    transition-property: width;
    transition-duration: 200ms;
    transition-timing-function: ease-in-out;
    transition-delay: 0ms ;
	/* background: #000 ; */
  }
	/*
  #homepage #header .con_header #menu ul li a:after {
    background: #000
  }
	*/
  #header .con_header #menu ul li a:hover:after {
    width: 80px
  }
  #header .con_header #menu ul li a i, #header .con_header #menu ul li a svg {
    width: 10px
  }
}
#contents {
  width: 100%;
  display: block;
  padding: 80px 0 60px;
}
#homepage #contents {
  padding: 0
}
body#index #contents {
  padding: 0 0 50px ;
}
@media only screen and (min-width:768px) {
  #contents {
    padding: 180px 0 150px
  }
  #toppage #contents {
    padding: 60px 0 150px
  }
  body#index #contents {
  padding: 60px 0 50px ;
  }
}
#homepage #footer {
  position: absolute;
  bottom: 0;
  right: 0
}
#footer .con_footer {
  text-align: center;
  font-size: 1.0rem;
  padding: 0 10px 10px 0
}
#footer .con_footer .copyright, #footer .con_footer .f_nav, #footer .con_footer a, #footer .con_footer li, #footer .con_footer ul {
  display: inline
}
#footer .con_footer .copyright, #footer .con_footer .f_nav, #footer .con_footer a, #footer .con_footer li, #footer .con_footer ul li {
    padding: 0 2px;
}
#footer .con_footer .copyright:before {
  content: "｜"
}
@media only screen and (min-width:768px) {
  #footer .con_footer {
    letter-spacing: 0.2ex;
    padding: 0 20px 20px 0
  }
  #homepage #footer .con_footer {
    -webkit-transition: color 200ms ease-in-out 0ms;
    -moz-transition: color 200ms ease-in-out 0ms;
    -ms-transition: color 200ms ease-in-out 0ms;
    -o-transition: color 200ms ease-in-out 0ms;
    transition-property: color;
    transition-duration: 200ms;
    transition-timing-function: ease-in-out;
    transition-delay: 0ms
  }
  #homepage.color #footer .con_footer {
    color: #fff
  }
  #homepage.color #footer .con_footer a {
    color: #fff
  }
  #footer .con_footer a {
    position: relative
  }
  #homepage #footer .con_footer a {
    -webkit-transition: color 200ms ease-in-out 0ms;
    -moz-transition: color 200ms ease-in-out 0ms;
    -ms-transition: color 200ms ease-in-out 0ms;
    -o-transition: color 200ms ease-in-out 0ms;
    transition-property: color;
    transition-duration: 200ms;
    transition-timing-function: ease-in-out;
    transition-delay: 0ms
  }
  #homepage #footer .con_footer a:after {
    background: #FFF100
  }
  #footer .con_footer a:after {
    content: "";
    display: block;
    position: absolute;
    width: 0;
    height: 1px;
    background: #000;
    bottom: -3px;
    left: 50%;
    -webkit-transform: translateX(-50%);
    -moz-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    -o-transform: translateX(-50%);
    transform: translateX(-50%);
    -webkit-transition: width 200ms ease-in-out 0ms;
    -moz-transition: width 200ms ease-in-out 0ms;
    -ms-transition: width 200ms ease-in-out 0ms;
    -o-transition: width 200ms ease-in-out 0ms;
    transition-property: width;
    transition-duration: 200ms;
    transition-timing-function: ease-in-out;
    transition-delay: 0ms
  }
  #footer .con_footer a:hover:after {
    width: 100%
  }
}
.contentstitle {
  font-weight: bold;
  text-align: center;
  font-family: "Hiragino Kaku Gothic ProN", "ヒラギノ角ゴ Pro W3", "游ゴシック体", "Yu Gothic", YuGothic, "メイリオ", Meiryo, sans-serif;
  font-size: 5.8vw;
  letter-spacing: 0.2ex;
  text-indent: 0.2ex;
  -webkit-font-feature-settings: "palt";
  -moz-font-feature-settings: "palt";
  font-feature-settings: "palt";
  border: 2px solid #000;
  margin-bottom: 50px;
}
.contentstitle .en {
  font-size: 6.4vw
}
@media only screen and (min-width:768px) {
  .contentstitle {
    font-weight: bold;
    text-align: center;
    font-size: 3.6rem;
    letter-spacing: 0.2ex;
    text-indent: 0.2ex;
    -webkit-font-feature-settings: "palt";
    -moz-font-feature-settings: "palt";
    font-feature-settings: "palt";
    border: 2px solid #000;
  }
  .contentstitle .en {
    font-size: 3.8rem
  }
}
input[type=text], select, textarea {
  -moz-appearance: none;
  -webkit-appearance: none;
  display: block;
  font-family: "Noto Sans JP", "Hiragino Kaku Gothic ProN", "ヒラギノ角ゴ Pro W3", "游ゴシック体", "Yu Gothic", YuGothic, "メイリオ", Meiryo, sans-serif;
  font-size: 1.4rem;
  color: #000;
  padding: 1.0ex 1.5ex;
  border: none;
  box-shadow: none;
  background: #ececec;
  width: 100%;
  border-radius: 4px
}
input[type=text]::-webkit-input-placeholder, select::-webkit-input-placeholder, textarea::-webkit-input-placeholder {
  color: #b2b2b2
}
input[type=text]:-ms-input-placeholder, select:-ms-input-placeholder, textarea:-ms-input-placeholder {
  color: #b2b2b2
}
input[type=text]::-moz-placeholder, select::-moz-placeholder, textarea::-moz-placeholder {
  color: #b2b2b2
}
input[type=text]:focus, select:focus, textarea:focus {
  outline: 0;
  border-color: none
}
input[type=text]:-webkit-autofill {
  -webkit-box-shadow: 0 0 0px 1000px #f7f7f7 inset
}
textarea::-webkit-input-placeholder {
  color: #999
}
textarea:-ms-input-placeholder {
  color: #999
}
textarea::-moz-placeholder {
  color: #999
}
input[type=text]:disabled {
  border: none;
  padding-left: 0
}
input[type=button], input[type=submit] {
  -moz-appearance: none;
  -webkit-appearance: none;
  appearance: none;
  text-align: center;
  margin: 0 auto;
  width: 260px;
  background: #000;
  color: #fff;
  font-size: 4.2vw;
  font-family: "Noto Sans JP", "Hiragino Kaku Gothic ProN", "ヒラギノ角ゴ Pro W3", "游ゴシック体", "Yu Gothic", YuGothic, "メイリオ", Meiryo, sans-serif;
  font-weight: bold;
  letter-spacing: 0.8ex;
  text-indent: 0.8ex;
  cursor: pointer;
  display: block;
  padding: 2.4vw 0;
  border: none;
  border-radius: 0;
  line-height: 2.2
}
input[type=button]#back, input[type=submit]#back {
  background: #663;
  margin-top: 10px
}
@media only screen and (min-width:768px) {
  input[type=text], select, textarea {
    font-size: 1.3rem;
    padding: 1.8ex 1.5ex;
    -webkit-transition: background 200ms ease-in-out 0ms;
    -moz-transition: background 200ms ease-in-out 0ms;
    -ms-transition: background 200ms ease-in-out 0ms;
    -o-transition: background 200ms ease-in-out 0ms;
    transition-property: background;
    transition-duration: 200ms;
    transition-timing-function: ease-in-out;
    transition-delay: 0ms
  }
  input[type=text]:focus, select:focus, textarea:focus {
    background: #fff;
	border:1px solid #dedede ;
  }
  input[type=text], select {
    height: 45px
  }
  input[type=text]:disabled {
    padding-right: 0;
    width: auto;
    -webkit-text-fill-color: #000;
    opacity: 1
  }
  input[type=button], input[type=submit] {
    width: 360px;
    background: none;
    color: #000;
    border: 2px solid #000;
    padding: 8px 0;
    font-size: 2.0rem;
    -webkit-transition: all 200ms ease-in-out 0ms;
    -moz-transition: all 200ms ease-in-out 0ms;
    -ms-transition: all 200ms ease-in-out 0ms;
    -o-transition: all 200ms ease-in-out 0ms;
    transition-property: all;
    transition-duration: 200ms;
    transition-timing-function: ease-in-out;
    transition-delay: 0ms
  }
  input[type=button]:hover, input[type=submit]:hover {
    background: #000;
    color: #fff
  }
  input[type=button]#submit, input[type=submit]#submit {
    width: 290px;
    float: right;
    letter-spacing: 1.6ex;
    text-indent: 1.6ex
  }
  input[type=button]#back, input[type=submit]#back {
    width: 290px;
    float: left;
    margin-top: 0;
    color: #663;
    border: 2px solid #663;
    background: none;
    letter-spacing: 1.6ex;
    text-indent: 1.6ex
  }
  input[type=button]#back:hover, input[type=submit]#back:hover {
    background: #663;
    color: #FFF100
  }
}

#top-mainvisual > .slide .navmenu-wrap .navmenu > li:last-child:before {
    content: '';
    display: block;
    width: 20px;
    height: 2px;
    background: gray;
    margin-left: auto;
    margin-top: 15px;
    margin-bottom: 13px;
    margin-right: 0;
}

@media only screen and (min-width:768px) {
#header .con_header #menu ul li.nav_tora {
  position:relative;
  margin-left:40px;
  
}
#header .con_header #menu ul li.nav_tora:before {
    content: ' ';
    background: #000;
    width: 1px;
    height: 15px;
    display: inline;
    position: absolute;
    left: -20px;
    top: 15px;
}
}

img.square_logo {
    max-width: 100px;
    display: inline-block;
    vertical-align: middle;
}
@media only screen and (min-width:768px) {
	img.square_logo {
    max-width: 190px;
    display: inline-block;
    vertical-align: middle;
	}
}

.fs0{
	font-size: 0 ;
}
.box_company_gallery {
	width: 50% ;
	margin: 0 auto ;
	display: inline-block;
	padding: 0 0.5% ;
}
.access_map {
    padding: 50px 0;
}


.mb10 {
	margin-bottom: 10px ;
}
.mb20 {
	margin-bottom: 20px ;
}
.mb30 {
	margin-bottom: 30px ;
}
.mb40 {
	margin-bottom: 40px ;
}
.mb50 {
	margin-bottom: 50px ;
}
.mb60 {
	margin-bottom: 60px ;
}
.mb70 {
	margin-bottom: 70px ;
}
.mb80 {
	margin-bottom: 80px ;
}
.mb90 {
	margin-bottom: 90px ;
}
.mb100 {
	margin-bottom: 100px ;
}

#animation_container {
  display: none;
}
#animation_container_sp {
  display: block;
}
@media only screen and (min-width:768px) {
  #animation_container {
    display: block;
  }
  #animation_container_sp {
    display: none;
  }
}