/*============================================================================

	#mainvisual

============================================================================*/



.line{
	fill:none;
	stroke:#FFFFFF;
	stroke-width:0.5;
	stroke-miterlimit:10;
}
.english{
	fill:#FFFFFF;
}
#main_catch{
    width: 564px;
    height: 260px;
}







.line {
    stroke: rgba(255, 255, 255, 0.59);
    fill: none;
    stroke-width: 1px;
    stroke-dasharray: 1000;
    stroke-dashoffset: 1000;
    -webkit-animation: line 3s ease-in-out 0s forwards;
    animation: line 3s ease-in-out 0s forwards;
}
 
@keyframes line{
	0%{stroke-dashoffset:1000;}
	100%{stroke-dashoffset:0;}
}
@-moz-keyframes line{
	0%{stroke-dashoffset:1000;}
	100%{stroke-dashoffset:0;}
}
@-webkit-keyframes line{
	0%{stroke-dashoffset:1000;}
	100%{stroke-dashoffset:0;}
}





.english {
	fill-opacity: 0;
    stroke: #fff;
    fill: #fff;
    stroke-width: 2px;
    stroke-dasharray: 1000;
    stroke-dashoffset: 1000;
    -webkit-animation: english 5s ease-in-out 0.7s forwards;
    animation: english 5s ease-in-out 0.7s forwards;
}
 
@keyframes english{
0%{
	stroke-dashoffset:1000;
	fill-opacity: 0;
	stroke-width:0.1em;
}
60%{
	stroke-dashoffset:0;
	stroke-width:0.05em;
}
100%{
	fill-opacity: 1;
	stroke-width:0;
}
}
@-moz-keyframes english{
0%{
	stroke-dashoffset:1000;
	fill-opacity: 0;
	stroke-width:0.1em;
}
80%{
	stroke-dashoffset:0;
	stroke-width:0.05em;
}
100%{
	fill-opacity: 1;
	stroke-width:0;
}
}
@-webkit-keyframes english{
0%{
	stroke-dashoffset:1000;
	fill-opacity: 0;
	stroke-width:0.1em;
}
60%{
	stroke-dashoffset:0;
	stroke-width:0.05em;
}
100%{
	fill-opacity: 1;
	stroke-width:0;
}
}





.line3 {
    stroke: rgba(255, 255, 255, 0.59);
    fill: none;
    stroke-width: 1px;
    stroke-dasharray: 1000;
    stroke-dashoffset: 1000;
    -webkit-animation: line 3s ease-in-out 0.8s forwards;
    animation: line 3s ease-in-out 0.8s forwards;
}
 
@keyframes line{
	0%{stroke-dashoffset:1000;}
	100%{stroke-dashoffset:0;}
}
@-moz-keyframes line{
	0%{stroke-dashoffset:1000;}
	100%{stroke-dashoffset:0;}
}
@-webkit-keyframes line{
	0%{stroke-dashoffset:1000;}
	100%{stroke-dashoffset:0;}
}





.and {
	fill-opacity: 0;
    stroke: #DA1316;
    fill: #DA1316;
    stroke-width: 1px;
    stroke-dasharray: 3000;
    stroke-dashoffset: 3000;
    -webkit-animation: and 2.5s ease-in-out 1.5s forwards;
    animation: and 2.5s ease-in-out 1.5s forwards;
	enable-background:new;
}
 
@keyframes and{
0%{
	stroke-dashoffset:3000;
	fill-opacity: 0;
	stroke-width:0.1em;
	stroke-opacity: 0.8;
}
30%{
	stroke-opacity: 0.6;
}
60%{
	stroke-dashoffset:0;
	stroke-width:0.05em;
	stroke-opacity: 0.4;
}
100%{
	fill-opacity: 0.4;
	stroke-width:0;
}
}
@-moz-keyframes and{
0%{
	stroke-dashoffset:3000;
	fill-opacity: 0;
	stroke-width:0.1em;
	stroke-opacity: 0.8;
}
30%{
	stroke-opacity: 0.6;
}
60%{
	stroke-dashoffset:0;
	stroke-width:0.05em;
	stroke-opacity: 0.4;
}
100%{
	fill-opacity: 0.4;
	stroke-width:0;
}
}
@-webkit-keyframes and{
0%{
	stroke-dashoffset:3000;
	fill-opacity: 0;
	stroke-width:0.1em;
	stroke-opacity: 0.8;
}
30%{
	stroke-opacity: 0.6;
}
60%{
	stroke-dashoffset:0;
	stroke-width:0.05em;
	stroke-opacity: 0.4;
}
100%{
	fill-opacity: 0.4;
	stroke-width:0;
}
}



@-moz-document url-prefix() {
.and {
    fill: #DA1316B3;
    stroke-dasharray: 1000;
    stroke-dashoffset: 1000;
    -webkit-animation: and 2s ease-in-out 1.5s forwards;
    animation: and 2s ease-in-out 1.5s forwards;
}

}





.line2 {
    stroke: rgba(255, 255, 255, 0.59);
    fill: none;
    stroke-width: 1px;
    stroke-dasharray: 1000;
    stroke-dashoffset: 1000;
    -webkit-animation: line 3s ease-in-out 1.6s forwards;
    animation: line 3s ease-in-out 1.6s forwards;
}
 
@keyframes line{
	0%{stroke-dashoffset:1000;}
	100%{stroke-dashoffset:0;}
}
@-moz-keyframes line{
	0%{stroke-dashoffset:1000;}
	100%{stroke-dashoffset:0;}
}
@-webkit-keyframes line{
	0%{stroke-dashoffset:1000;}
	100%{stroke-dashoffset:0;}
}





.english2 {
	fill-opacity: 0;
    stroke: #fff;
    fill: #fff;
    stroke-width: 2px;
    stroke-dasharray: 1000;
    stroke-dashoffset: 1000;
    -webkit-animation: english 2.5s ease-in-out 2.3s forwards;
    animation: english 2.5s ease-in-out 2.3s forwards;
}
 
@keyframes english{
0%{
	stroke-dashoffset:1000;
	fill-opacity: 0;
	stroke-width:0.1em;
}
60%{
	stroke-dashoffset:0;
	stroke-width:0.05em;
}
100%{
	fill-opacity: 1;
	stroke-width:0;
}
}
@-moz-keyframes english{
0%{
	stroke-dashoffset:2000;
	fill-opacity: 0;
	stroke-width:0.1em;
}
60%{
	stroke-dashoffset:0;
	stroke-width:0.05em;
}
100%{
	fill-opacity: 1;
	stroke-width:0;
}
}
@-webkit-keyframes english{
0%{
	stroke-dashoffset:2000;
	fill-opacity: 0;
	stroke-width:0.1em;
}
60%{
	stroke-dashoffset:0;
	stroke-width:0.05em;
}
100%{
	fill-opacity: 1;
	stroke-width:0;
}
}












/*============================================================================

	下層用

============================================================================*/

.mainvisual_under{
}
.st0{
	enable-background:new;
}



/*h2*/
#tit_about {
    width: 462px;
}
#tit_inerview {
    width: 321px;
}
#tit_pick {
    width: 245px;
}
#tit_works {
    width: 220px;
}
#tit_works01 {
	width: 230px;
}

#tit_search{
	width:228px;
}
#tit_info{
	width:140px;
}

#tit_outline{
	width:249px;
}
#tit_outline01 {
    width: 454px;
}
#tit_outline02 {
    width: 393px;
}
#tit_outline03 {
    width: 305px;
}
#tit_contact{
	width:283px;
}


.tit_h2 {
	fill-opacity: 0;
    stroke: #fff;
    fill: #fff;
    stroke-width: 2px;
    stroke-dasharray: 1000;
    stroke-dashoffset: 1000;
    -webkit-animation: english 3s ease-in-out 0s forwards;
    animation: english 3s ease-in-out 0s forwards;
}
 
@keyframes english{
0%{
	stroke-dashoffset:1000;
	fill-opacity: 0;
	stroke-width:0.1em;
}
60%{
	stroke-dashoffset:0;
	stroke-width:0.05em;
}
100%{
	fill-opacity: 1;
	stroke-width:0;
}
}
@-moz-keyframes english{
0%{
	stroke-dashoffset:1000;
	fill-opacity: 0;
	stroke-width:0.1em;
}
80%{
	stroke-dashoffset:0;
	stroke-width:0.05em;
}
100%{
	fill-opacity: 1;
	stroke-width:0;
}
}
@-webkit-keyframes english{
0%{
	stroke-dashoffset:1000;
	fill-opacity: 0;
	stroke-width:0.1em;
}
60%{
	stroke-dashoffset:0;
	stroke-width:0.05em;
}
100%{
	fill-opacity: 1;
	stroke-width:0;
}
}













/*============================================================================

	ブラウザ調整

============================================================================*/

/*IE用*/
@media all and (-ms-high-contrast:none){

.english, .english2, .tit_h2 {
	fill-opacity: 1;
}

.and {
    fill: rgba(218, 19, 22, 0.41);
	fill-opacity: 1;
}

.line, .line2, .line3 {
    stroke-dashoffset: inherit;
}

}



/*IE Edge用*/
_:-ms-lang(x), _::-webkit-meter-bar,.line, _:-ms-lang(x), _::-webkit-meter-bar,.line2, _:-ms-lang(x), _::-webkit-meter-bar,.line3 {
    stroke-dashoffset: inherit;
}







@media screen and (max-width:640px) {
#tit_about{
	width:320px;
}
#tit_pick{
	width:175px;
}

}



@media screen and (max-width:320px) {
#tit_about{
	width:260px;
}
}