@charset "UTF-8";
	
#news h2,
#vision h2,
#service h2,
#public h2,
#other h2 {
	font-size: 55px;
	font-weight: bold;
	line-height: 1;
	}
	#news h2 span,
	#vision h2 span,
	#service h2 span,
	#public h2 span,
	#other h2 span {
		font-size: 20px;
		font-weight: bold;
		}
	
	#vision #vision_inner p span,
	#service #service_inner p ,
	#public #public_inner p span,
	#other p {
		font-weight: bold !important;
    font-weight: normal !important;
		line-height: 1.7;
		}
@media(max-width: 768px){
  #news h2,
  #vision h2,
  #service h2,
  #public h2,
  #other h2 {
    font-size: 50px;
    }
    #news h2 span,
    #vision h2 span,
    #service h2 span,
    #public h2 span,
    #other h2 span {
      font-size: 16px;
      }
    #vision #vision_inner p span,
    #service #service_inner p ,
    #public #public_inner p span,
    #other p {
      font-weight: bold !important;
      line-height: 1.7;
      }
	}
		
		
/* visual --------------------------------------------------------------- */
#visual {
	width: 100%;
	margin: 0 auto 30px auto;
	overflow:  hidden;
	position: relative;
	}
	
	#visual #Vobj_dummy,
	#visual #Vobj_L,
	#visual #Vobj_R,
	#visual #Vobj_B {
		width: 100%;
		}
	#visual #Vobj_L {
		opacity:  0;
		position: absolute;
		left: -10%;
		top: 0;
		}
	
	#visual #Vobj_R {
		opacity:  0;
		position: absolute;
		right: -30%;
		top: 0;
		}
	#visual #Vobj_B {
		height: 70%;
		opacity: 0;
		position: absolute;
		left: 0;
		bottom: 0;
		}
		
		#visual #Vobj_dummy img,
		#visual #Vobj_L img,
		#visual #Vobj_R img,
		#visual #Vobj_B img {
			width: 100%;
      /*height: calc(100vh - 70px);*/
			}
	#visual #visual_h1 {
		transform: translate(0, -50%);
		position: absolute;
		left: 5%;
		top: 36%;
		}
					
		#visual #visual_h1 h1 {
			color: #ffffff;
			font-size: 64px;
			line-height: 65px;
			font-weight: bold;
			}
				
			#visual #visual_h1 h1 span {
				font-size: 20px;
				font-weight: bold;
				line-height: 1;
				margin-bottom: 20px;
				}
  #visual #visual_circle {
    width: 350px;
    height: 350px;
    transform: translate(0, -50%);
    position: absolute;
    left: 15%;
    top: 40%;
    }
    #visual #visual_circle img {
      width: 100%;
      }
	
	#visual #visual_p {
		width: 26em;
		position: absolute;
		right: 5%;
    bottom: 13%;
		}
			
		#visual #visual_p p {
			color: #ffffff;
      font-size: 14px;
			line-height: 1.6;
			}
			
    #visual #visual_p a {
      text-align: right;
      margin: 10px 0 0 auto;
      }
      #visual #visual_p a,
      #visual #visual_p a img {
        width: 100px;
        }
	
	#visual #visual_scr {
    width: 50px;
    height: 50px;
		text-align: center;
		transform: translate(-50%,0);
		position: absolute;
		left: 50%;
		bottom: 15%;
		}
    #visual #visual_scr a,
    #visual #visual_scr a img {
      width: 100%;
      }
@media(max-width: 768px){
  #visual {
    width: 100%;
    margin: 0 auto 50px auto;
    }
		#visual #Vobj_md,
    #visual #Vobj_m1,
    #visual #Vobj_m2,
    #visual #Vobj_m3 {
      width: 100%;
      }
  
    #visual #Vobj_md {
      margin-bottom: 70px;
      }
  
    #visual #Vobj_m1 {
      opacity:  0;
      position: absolute;
      right: -30%;
      top: 0;
      }
    #visual #Vobj_m2 {
      opacity:  1;
      position: absolute;
      right: -100%;
      top: 0;
      }
    #visual #Vobj_m3 {
      opacity: 1;
      position: absolute;
      left: -100%;
      top: 0;
      }
  
      #visual #Vobj_md img,
      #visual #Vobj_m1 img,
      #visual #Vobj_m2 img,
      #visual #Vobj_m3 img {
        width: 100%;
        }
    #visual #visual_h1 {
      transform: translate(0, 0);
      position: absolute;
      left: 5%;
      top: 17%;
      }
      #visual #visual_h1 h1 {
        font-size: 40px;
        line-height: 50px;
        letter-spacing: -1;
        }
        #visual #visual_h1 h1 span {
          font-size: 17px;
          line-height: 25px;
          margin-bottom: 10px;
          }
    #visual #visual_p {
      width: 90%;
      margin: 0 auto;
      position: static;
      }
      #visual #visual_p p {
        color: #000;
        font-size: inherit;
        }
  
      #visual #visual_p a {
        width: 100px;
        height: 100px;
        text-align: center;
        margin: 30px auto 0 auto;
        padding-top: 0;
        }
	}
/* text-in --------------------------------------------------------------- */
.VtinLeft,
.VtinLeft2 {
	opacity: 0;
	transition: all 1s ease;
	-webkit-clip-path: inset(0 100% 0 0);
	clip-path: inset(0 100% 0 0);
	}
.VtinLeft.move {
	opacity: 1;
	transition-delay: 3s;
	-webkit-clip-path: inset(0);
	clip-path: inset(0);
	}
.VtinLeft2.move {
	opacity: 1;
	transition-delay: 4s;
	-webkit-clip-path: inset(0);
	clip-path: inset(0);
	}
.VtinTop {
	opacity: 0;
	transition: all 1s ease;
	-webkit-clip-path: inset(0 0 100% 0);
	clip-path: inset(0 0 100% 0);
	}
.VtinTop.move {
	opacity: 1;
	transition-delay: 4s;
	-webkit-clip-path: inset(0);
	clip-path: inset(0);
	}
.Vfade {
	transition: all 1s ease;
	opacity: 0;
	}
.Vfade.move {
	transition-delay: 5s;
	opacity: 1;
	}
@media(max-width: 768px){
	}
	
/* news --------------------------------------------------------------- */
#news {
	width: 90%;
	margin: 0 auto 150px auto;
	position: relative;
	}
	
	#news #news_inner {
		width: 600px;
		margin: 0 auto;
		padding: 0 200px 0 100px;
		}
		
		#news #news_inner h2 {
			margin-bottom: 30px;
			}
			
		#news #news_inner dl {
			margin: 0 auto 25px auto;
			}
			
			#news #news_inner dl dt {
				width: 6em;
				text-align: center;
				margin-bottom: 10px;
				padding: 2px 5px;
				color: #ffffff;
				background-color: #606060;
				}
@media(max-width: 768px){
  #news {
    margin: 0 auto 100px auto;
    }
    #news #news_inner {
      width: 100%;
			padding: 0;
      }
  
      #news #news_inner dl {
        margin: 0 auto 15px auto;
        }
	}
/* vision --------------------------------------------------------------- */
#vision {
	width: 90%;
	margin: 0 auto 200px auto;
	position: relative;
	}
	
	#vision #vision_obj,
	#vision #vision_obj p,
	#vision #vision_obj p img {
		width: 420px;
		height: 432px;
		}
	
	#vision #vision_obj {
		position: absolute;
		left: 0;
		top: -90px;
		}
		
		#vision #vision_obj p {
			position: relative;
			}
			
			#vision #vision_obj p img.obj_A,
			#vision #vision_obj p img.obj_B {
				position: absolute;
				}
			
			#vision #vision_obj p img.obj_A {
				left: 0;
				top: 0;
				}
			
			#vision #vision_obj p img.obj_B {
				opacity: 0;
				transform: scale(0.7);
				transition: .5s;
				left: 0;
				bottom: 0;
				}
			
			#vision #vision_obj p img.obj_B.action {
				opacity: 1;
				transform: scale(1);
				transition-delay: 0.5s;
				}
								
	#vision #vision_inner {
		width: 900px;
		margin: 0 auto;
		}
		#vision #vision_inner h2 {
			margin: 0 0 40px 100px;
			}
			
			#vision #vision_inner h2 span {
				margin-top: 30px;
				}
	
		#vision #vision_inner p {
			width: 34em;
			margin: 0 50px 0 auto;
			}
			
@media(max-width: 768px){
  #vision {
    margin: 0 auto 100px auto;
    }
    #vision #vision_obj,
    #vision #vision_obj p,
    #vision #vision_obj p img {
      width: 300px;
      height: 309px;
      }
    #vision #vision_obj {
      position: absolute;
      left: -25px;
      top: 100px;
      }
  
    #vision #vision_inner {
      width: 100%;
      }
      #vision #vision_inner h2 {
        margin: 0 auto 220px auto;
        }
        #vision #vision_inner h2 span {
          margin-top: 30px;
          }
      #vision #vision_inner p {
        width: 100%;
        margin: 0 auto;
        }
	}
	
	
	
/* service --------------------------------------------------------------- */
#service {
	width: 90%;
	margin: 0 auto 200px auto;
	position: relative;
	}
	
	#service #service_obj,
	#service #service_obj p,
	#service #service_obj p img {
		width: 440px;
		height: 434px;
		}
	
	#service #service_obj {
		position: absolute;
		right: 0;
		top: -50px;
		}
		
		#service #service_obj p {
			position: relative;
			}
			
			#service #service_obj p img.obj_A,
			#service #service_obj p img.obj_B {
				position: absolute;
				}
			
			#service #service_obj p img.obj_A {
				left: 0;
				top: 0;
				}
			
			#service #service_obj p img.obj_B {
				opacity: 0;
				transform: scale(0.7);
				transition: .5s;
				left: 0;
				bottom: 0;
				}
			
			#service #service_obj p img.obj_B.action {
				opacity: 1;
				transform: scale(1);
				transition-delay: 0.5s;
				}
	#service #service_inner {
		width: 800px;
		margin: 0 auto;
		}
		#service #service_inner h2 {
			text-align: right;
			margin-bottom: 40px;
			}
			
			#service #service_inner h2 span {
				margin-top: 30px;
				}
	
		#service #service_inner p {
			width: 28em;
			margin-bottom: 30px;
			}
				
		#service #service_inner dl {
			width: 28em;
			margin-bottom: 5px;
			}
			
			#service #service_inner dl dt {
				cursor: pointer;
				font-weight: bold;
				background-image: url(../../img/home/service/trg.png);
				background-position: right center;
				background-size: 15px 15px;
				}
			
			#service #service_inner dl dt.trg.active {
				background-image: url(../../img/home/service/trg_active.png);
				}
			
			#service #service_inner dl dd {
				display: none;
				padding: 10px 0;
				}
				
@media(max-width: 768px){
  #service {
    margin: 0 auto 100px auto;
    }
    #service #service_obj,
    #service #service_obj p,
    #service #service_obj p img {
      width: 300px;
      height: 295px;
      }
    #service #service_obj {
      position: absolute;
      right: -30px;
      top: -10px;
      }
  
    #service #service_inner {
      width: 100%;
      }
      #service #service_inner h2 {
        text-align: left;
        margin-bottom: 200px;
        }
      #service #service_inner p {
        width: 100%;
        }
      #service #service_inner dl {
        width: 100%;
        margin-bottom: 10px;
        }
	}
/* public --------------------------------------------------------------- */
#public {
	width: 90%;
	margin: 0 auto 150px auto;
	position: relative;
	}
	
	#public #public_obj,
	#public #public_obj p,
	#public #public_obj p img {
		width: 420px;
		height: 432px;
		}
	
	#public #public_obj {
		position: absolute;
		left: 0;
		top: -50px;
		}
		
		#public #public_obj p {
			position: relative;
			}
			
			#public #public_obj p img.obj_A,
			#public #public_obj p img.obj_B {
				position: absolute;
				}
			
			#public #public_obj p img.obj_A {
				left: 0;
				top: 0;
				}
			
			#public #public_obj p img.obj_B {
				opacity: 0;
				transform: scale(0.7);
				transition: .5s;
				left: 0;
				bottom: 0;
				}
			
			#public #public_obj p img.obj_B.action {
				opacity: 1;
				transform: scale(1);
				transition-delay: 0.5s;
				}
		
	#public #public_inner {
		width: 800px;
		margin: 0 auto;
		}
		#public #public_inner h2 {
			margin: 0 0 40px 100px;
			}
			
			#public #public_inner h2 span {
				margin-top: 30px;
				}
	
		#public #public_inner p {
			width: 30em;
			margin: 0 0 0 auto;
			}
			
@media(max-width: 768px){
  #public {
    margin: 0 auto 50px auto;
    }
    #public #public_obj,
    #public #public_obj p,
    #public #public_obj p img {
      width: 300px;
      height: 300px;
      }
    #public #public_obj {
      position: absolute;
      left: -120px;
      top: -30px;
      }
    #public #public_inner {
      width: 100%;
      }
      #public #public_inner h2 {
        margin: 0 auto 160px auto;
        }
        #public #public_inner h2 span {
          margin-top: 30px;
          }
      #public #public_inner p {
        width: 100%;
        margin: 0 auto;
        }
	}
/* other --------------------------------------------------------------- */
#other {
	width: 650px;
	margin: 0 auto 80px auto;
	padding-top: 150px;
	border-top: solid 1px;
	border-color: #3399cc !important;
	overflow: hidden;
	position: relative;
	}
	#other h2 {
		margin-bottom: 40px;
		}
		
		#other h2 span {
			margin-top: 10px;
			}
				
	#other #other_team,
	#other #other_recruit {
		width: 300px;
		}
	
	#other #other_team {
		float: left;
		}
	
	#other #other_recruit {
		float: right;
		}
		
		#other #other_team p,
		#other #other_recruit p {
			height: 390px;
			position: relative;
			}
			
			#other #other_team p a,
			#other #other_recruit p a {
				position: absolute;
				left: 0;
				bottom: 0;
				}
@media(max-width: 768px){
  #other {
    width: 100%;
    margin: 0 auto 50px auto;
    padding-top: 50px;
    }
    #other #other_team,
    #other #other_recruit {
      width: 90%;
      margin: 0 auto;
      }
    #other #other_team {
      float: none;
      margin-bottom: 50px;
      }
    #other #other_recruit {
      float: none;
      }
      #other #other_recruit h2 {
        text-align: right;
        }
  
      #other #other_team p,
      #other #other_recruit p {
        height: auto;
        }
        #other #other_team p a,
        #other #other_recruit p a {
          position: static;
          }
	}
/* link --------------------------------------------------------------- */
#link {
  width: 320px;
  height: 320px;
  padding-top: 45px;
  box-sizing: border-box;
  background-image: url("../../img/home/link/bg.png");
  background-size: 100% 100%;
  position: absolute;
  right: 0;
  top: 0;
  }
  #link h3 {
    font-size: 20px;
    font-weight: bold;
    text-align: center;
    line-height: 1;
    margin-bottom: 35px;
    }
    #link #tipbox {
      width: 160px;
      margin: 0 auto;
      }
      #link #tipbox a {
        margin: 0 auto 10px auto;
        line-height: 1;
        }
        #link #tipbox a img {
          width: 100%;
          }
.tip {
  position: relative;
  cursor: pointer;
  display: inline-block;
  margin: 0 auto 10px auto;
  }
  .tip p {
    margin:0;
    padding:0;
    }
.desc {
  display: none;
  position: absolute;
  padding: 10px;
  font-size: 12px;
  line-height: 1.6em;
  color: #fff;
  text-align: center;
  border-radius: 5px;
  background-color: #606060;
  width: 20em;
  }
  .desc:before {
    content: "";
    position: absolute;
    top: 100%;
    left: 50%;
    border: 15px solid transparent;
    border-top: 15px solid #606060;
    margin-left: -15px;
    }
  .tip:hover .desc {
    display: inline-block;
    top: -55px;
    left: -50px;
    }
@media(max-width: 768px){
  #link {
    width: 320px;
    height: 320px;
    padding-top: 45px;
    position: static;
    margin: 0 auto 40px auto;
    }
  
  .tip:hover .desc {
    display: none;
    }
  }
