/* トップ
----------------------------------*/
.hero_area {
  background-image: url(../img/home/hero/hero_bg.jpg);
  background-size: cover;
  background-position: center top;
  position: relative;
  background-repeat: no-repeat;
  height: 100vh;
}
/*@media (max-width: 1199px) {
.hero_area {  
  height: 55vh;
	
}
}
@media (max-width: 767px) {
.hero_area {  
  height: 85vh;
	
}
}*/
.hero_logo {
  position: absolute;
  top: 10%;
  display: flex;
	width: 100%;
  justify-content: center;
  align-items: center;
  z-index: 1;
}
.hero_logo img {
  width: 30vw;
}
@media (max-width: 991px) {
.hero_logo img {
  width: 45vw;
}
}
@media (max-width: 767px) {
.hero_logo img {
  width: 60vw;
}
}
@media (max-width: 575px) {

.hero_logo img {
  width: 90vw;
}
}
.hero_square {
  position: absolute;
  top: 0;
  display: flex;
	width: 100%;
  justify-content: center;
  align-items: center;
  z-index: 0;
}
.hero_square img {
  width: 40vw;
}
@media (max-width: 991px) {
.hero_square img {
  width: 60vw;
}
}
@media (max-width: 767px) {
.hero_square img {
  width: 90vw;
}
}
.hero_cloud01 {
  position: absolute;
  top: 10%;
  left: 30%;
}
.hero_cloud01 img {
  width: 8vw;
}
@media (max-width: 767px) {
.hero_cloud01 {
  position: absolute;
  top: 10%;
  left: 10%;
}
.hero_cloud01 img {
  width: 18vw;
}
}
.hero_cloud02 {
  position: absolute;
  top: 20%;
  right: 32%;
}
.hero_cloud02 img {
  width: 6vw;
}
@media (max-width: 767px) {
.hero_cloud02 {
  position: absolute;
  top: 20%;
  right: 12%;
}
	.hero_cloud02 img {
  width: 16vw;
}
}
.hero_cloud03 {
  position: absolute;
  top: 50%;
  left: 33%;
}
.hero_cloud03 img {
  width: 5vw;
}
@media (max-width: 767px) {
.hero_cloud03 {
  position: absolute;
  top: 50%;
  left: 13%;
}
	.hero_cloud03 img {
  width: 15vw;
}
}
.hero_cloud04 {
  position: absolute;
  top: 60%;
  right: 30%;
}
.hero_cloud04 img {
  width: 7vw;
}
@media (max-width: 767px) {
.hero_cloud04 {
  position: absolute;
  top: 60%;
  right: 10%;
}
	.hero_cloud04 img {
  width: 17vw;
}
}
.hero_sakura {
  position: absolute;
  bottom: -20%;
  left: 0%;
}
.hero_sakura img {
  width: 35vw;
}
.hero_kanban {
  position: absolute;
  top: 0%;
  left: 5%;
  z-index: 1;
}
.hero_kanban img {
  width: 8vw;
}
@media (max-width: 767px) {
.hero_kanban {
    position: static;
    text-align: center;  /*top: 10%;
  left: 50%;
  transform: translateX(-50%);
  -webkit-transform: translateX(-50%);
  -ms-transform: translateX(-50%);
	z-index: 1;*/
    margin-right: auto;
    margin-left: auto;
}
.hero_kanban img {
  width: 10vw;
}
}
@media (max-width: 575px) {

.hero_kanban img {
  width: 20vw;
}
}
.hero_read {
  position: absolute;
  bottom: 3%;
  right: 0%;
}
.hero_read img {
  width: 30vw;
}
@media (max-width: 767px) {
.hero_read {    
    bottom: 0%;
    left: 30%;
	right: 30%;
  
}
.hero_read img {
  width: 50vw;
}
}
@media (max-width: 575px) {
.hero_read {    
    bottom: 0%;
    left: 10%;
	right: 10%;
  
}
.hero_read img {
  width: 80vw;
}
}
.hero_bg02 {
  position: absolute;
  top: -50%;
  left: 0%;
}
.hero_bg02 img {
  width: 30vw;
}
.lr_move {
  animation: lr_move 1.5s 0s alternate ease-in-out infinite;
}
.lr_move2 {
  animation: lr_move2 1.5s 0s alternate ease-in-out infinite;
}
.lr_move3 {
  animation: lr_move 2.0s 0s alternate ease-in-out infinite;
}
.lr_move4 {
  animation: lr_move2 2.0s 0s alternate ease-in-out infinite;
}
@keyframes lr_move {
  0% {
    transform: translate(0px, 0);
  }
  100% {
    transform: translate(30px, 0);
  }
}
@keyframes lr_move2 {
  0% {
    transform: translate(0px, 0);
  }
  100% {
    transform: translate(20px, 0);
  }
}
.circle_move {
  animation-name: anim_r;
  animation-duration: 3s;
  animation-timing-function: linear;
  animation-direction: normal;
}
.circle_move {
  animation: circle_move 2.5s 0s normal linear;
}
@keyframes circle_move {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(180deg);
  }
}
.zoomin {
  animation: zoomin 2.5s 2s both ease-in-out;
}
@keyframes zoomin {
  0% {
    transform: scale(0.8);
    opacity: 0;
  }
  100% {
    opacity: 1;
    transform: scale(1);
  }
}
/*.fadein {
  animation-name: fadeIn;
  animation-direction: normal;
}
 
@keyframes fadeIn {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}*/
.slidein {
  animation: slidein 1.0s 3s both ease-in-out;
}
@keyframes slidein {
  0% {
    transform: translateX(120px);
    opacity: 0;
  }
  100% {
    transform: translateX(0);
  }
  50%, 100% {
    opacity: 1;
  }
}
/*.fadeInUp {
animation: fadeInUp 0.7s ease 0s 1 normal;
}

@keyframes fadeInUp {
  0% {
    opacity: 0;
    transform: translateY(30px);
  }
  100% {
    opacity: 1;
  }
}*/

.kanban_area {
    display: none;    
}
@media (max-width: 767px) {
.kanban_area {
    position: relative;
    margin-left: 0px;
    margin-right: 0px;
    padding-bottom: 10%;
    padding-top: 10px;
    background-image: url(../img/home/hero/hero_bg02.png);    /*color: #727171;*/
    background-repeat: no-repeat;
    background-size: contain;
    background-position: left bottom;
    display: block;
}
  
}

/* 挨拶
------------------------------------------------------------*/
.greetings_area {
    position: relative;
    margin-left: 0px;
    margin-right: 0px;
    padding-bottom: 10%;
    padding-top: 10%;
    background-image: url(../img/home/greetings_bg.jpg);    /*color: #727171;*/
    background-repeat: repeat-y;
    background-size: contain;
    background-position: center top;
}
@media (max-width: 575px) {
.greetings_area {    
    /*margin-left: 10px;
    margin-right: 10px;*/
}	
}
.greetings_tx {
    font-size: 1.4rem;
    color: #4d4d4d;
    padding-left: 10px;
    padding-right: 10px;
    margin-bottom: 20px;
    font-family: "Hina Mincho", serif;
    margin-top: 5%;
    line-height: 1.8;
}
.greetings_name {
    font-size: 1.4rem;
    color: #3c2617;
    padding-left: 10px;
    padding-right: 10px;
    margin-bottom: 20px;
    font-family: "Hina Mincho", serif;
    margin-top: 7%;
    text-align: right;
}
.greetings_name span {
    font-size: 2.8rem;    
    margin-left: 20px;
}
.greetings_img {
  position: absolute;
  top: -10%;
  right: 15%;
}
.greetings_img img {
  width: 10vw;
}

@media (max-width: 575px) {
.greetings_img {
  position: absolute;
  top: -5%;
  right: 5%;
}
.greetings_img img {
  width: 20vw;
}
}
.greetings_img02 {
  position: absolute;
  bottom: 5%;
  left: 5%;
}
.greetings_img02 img {
  width: 35vw;
}
@media (max-width: 575px) {
.greetings_img02 {
  position: absolute;
  bottom: 2%;
  left: 0%;
}
.greetings_img02 img {
  width: 55vw;
}
}


/* 会社概要
------------------------------------------------------------*/
.com_area {
    position: relative;
    margin-left: 0px;
    margin-right: 0px;
    padding-bottom: 10%;
    padding-top: 10%;    
}
@media (max-width: 575px) {
.com_area {    
    /*margin-left: 10px;
    margin-right: 10px;*/
}	
}
.n_table {
    clear: both;
    width: 100%;
    margin-bottom: 25px;
    margin-right: auto;
    margin-left: auto;
    margin-top: 5%;
}
.n_table tr {
    border-bottom-width: 1px;
	border-bottom-style: solid;
	border-bottom-color: #4d4d4d;
}
.n_table tr:last-child{
border-bottom-width: 0px;
}
.n_table th {
    width: 30%;    
    color: #3C2617;
	text-align: center;
	border-right-width: 1px;
	border-right-style: solid;
	border-right-color: #4d4d4d;
	padding: 15px;
}
.n_table td {
    width: 70%;
    background-color: #fff;
    text-align: left;
    padding-top: 15px;
    padding-right: 15px;
    padding-left: 40px;
    padding-bottom: 15px;
}
.n_table th,.n_table td {
	font-size: 16px;
	line-height: 1.8;	
	vertical-align: top;	
	
	font-feature-settings: "palt";	
}
.com_img {
  position: absolute;
  top: 5%;
  right: 15%;
}
.com_img img {
  width: 7vw;
}
@media (max-width: 575px) {
.com_img {
  position: absolute;
  top: 5%;
  right: 5%;
}
.com_img img {
  width: 17vw;
}
}
/* マップ
------------------------------------------------------------*/
.map_area {
    position: relative;
    margin-left: 0px;
    margin-right: 0px;
    padding-bottom: 10%;
    padding-top: 10%;
    background-image: url(../img/home/map_bg.jpg);    /*color: #727171;*/
    background-repeat: repeat;
    background-size: cover;
    background-position: center top;
	background-color: rgba(255,255,255,0.5);
  background-blend-mode: lighten;
}
@media (max-width: 575px) {
.map_area {    
    /*margin-left: 10px;
    margin-right: 10px;*/
}	
}
.map_box {
    margin-top: 5%;
}
.map_box iframe {
    width: 100%;
    height: 400px;
}

.map_img {
  position: absolute;
  top: -2%;
  left: 15%;
}
.map_img img {
  width: 7vw;
}
@media (max-width: 575px) {
.map_img {
  position: absolute;
  top: -2%;
  left: 5%;
}
.map_img img {
  width: 17vw;
}
}
/*# contact_area */
.contact_area {
    position: relative;
    margin-left: 0px;
    margin-right: 0px;
    padding-bottom: 0%;
    padding-top: 5%;  
	text-align: center;
}
@media (max-width: 575px) {
.contact_area {    
       
}
}
.contact_ttl {
    font-size: 28px;
    margin-top: 20px;
    margin-bottom: 20px;
    color: #0E586A;
    font-family: "Hina Mincho", serif;
    letter-spacing: 0.3em;
}
.contact_read {
    font-size: 16px; 
    margin-top: 20px;
	margin-bottom: 20px;
}
.contact_tel {
    font-size: 22px;
    margin-bottom: 10px;
	color: #0E586A;
    font-weight: bold;
}
.contact_tel a {
    color: #0E586A;
	font-size: 45px;
}

