@charset "UTF-8";


/*PC*/
@media print, screen and (min-width: 769px) {

.smart { background: #90cfca url("../images/index/bg.png") 0 0 no-repeat !important; background-size: 100% !important; width: 530px !important;}
.smart::before { content: ""; background: #5554a1; z-index: 80; position: absolute; top: 0; bottom: 0; width: 20px; left: 0;}
.smart::after  { content: ""; background: #5554a1; z-index: 80; position: absolute; top: 0; bottom: 0; width: 20px; right: 0;}


.smart .logo { width: 238px !important; position: absolute !important; top: 10px; left: 10px;}

.cont {}
.cont .box01 { min-height: calc( 100vh - 60px ); height: 880px; position: relative;}
.cont .box01 .figure_main01 { position: absolute; z-index: 10; top: -76px; left: 89px; width:  57px;}
.cont .box01 .figure_main02 { position: absolute; z-index: 10; top:  23px; left: -12px; width:  71px;}
.cont .box01 .figure_main03 { position: absolute; z-index: 10; top:  -30px; left: 187px; width:  92px;}
.cont .box01 .figure_main04 { position: absolute; z-index: 10; top: -120px; left: 240px; width: 182px;}
.cont .box01 .figure_main05 { position: absolute; z-index: 10; top:  -28px; left: 277px; width:  98px;}
.cont .box01 .figure_main06 { position: absolute; z-index: 10; top:    0px; left: 132px; width:  97px;}
.cont .box01 .figure_main07 { position: absolute; z-index: 10; top: 58px; left: -117px; width: 182px;}
.cont .box01 .figure_main08 { position: absolute; z-index: 11; top:  110px; left: -34px; width:  92px;}
.cont .box01 .figure_main09 { position: absolute; z-index: 10; top:  160px; left: -30px; width:  65px}
.cont .box01 .figure_main10 { position: absolute; z-index: 10; top:  100px; left: 440px; width:  28px;}

.cont .box01 .figure_main11 { position: absolute; z-index: 10; top: 180px; left: 456px; width:  69px;}
.cont .box01 .figure_main12 { position: absolute; z-index: 10; top: 498px; left: 383px; width:  72px;}
.cont .box01 .figure_main13 { position: absolute; z-index: 10; top: 426px; left: 426px; width: 143px;}
.cont .box01 .figure_main14 { position: absolute; z-index: 10; top: 519px; left: 438px; width:  77px;}
.cont .box01 .figure_main15 { position: absolute; z-index: 10; top: 576px; left: 20px; width:  12px;}
.cont .box01 .figure_main16 { position: absolute; z-index: 10; top: 610px; left: 155px; width:  36px;}
.cont .box01 .figure_main17 { position: absolute; z-index: 10; top: 590px; left: -50px; width:  97px;}
.cont .box01 .figure_main18 { position: absolute; z-index: 10; top: 636px; left: 8px; width:  71px;}
.cont .box01 .figure_main19 { position: absolute; z-index: 10; top: 646px; left: 244px; width:  56px;}
.cont .box01 .figure_main20 { position: absolute; z-index: 10; top: 706px; left: 227px; width:  21px;}

.cont .box01 .figure_main21 { position: absolute; z-index: 10; top: 672px; left: -98px; width: 182px;}
.cont .box01 .figure_main22 { position: absolute; z-index: 10; top: 722px; left: -12px; width:  92px;}
.cont .box01 .figure_main23 { position: absolute; z-index: 10; top: 648px; left: 442px; width:  97px;}
.cont .box01 .figure_main24 { position: absolute; z-index: 10; top: 823px; left: 225px; width:  37px;}
.cont .box01 .figure_main25 { position: absolute; z-index: 10; top: 742px; left: 423px; width:  97px;}
.cont .box01 .figure_main26 { position: absolute; z-index: 10; top: 796px; left: 404px; width:  92px;}
.cont .box01 .figure_main27 { position: absolute; z-index: 10; top: 788px; left: 470px; width:  72px;}


.cont .box01 .staff01 { position: absolute; z-index: 40; top: -17px; left: 274px; width: 183px;}
.cont .box01 .staff02 { position: absolute; z-index: 40; top: 527px; left: 274px; width: 178px;}
.cont .box01 .staff03 { position: absolute; z-index: 40; top: 658px; left:  57px; width: 181px;}

.cont .box01 .txt01 { position: absolute; z-index: 30; top: 136px; left: 41px; width: 411px;}


.cont .box02 { position: relative;}
.cont .box02 .bnr { position: relative; z-index: 50;}
.cont .box02 .bnr01 { width: 440px; margin: 0 auto 30px;}
.cont .box02 .bnr02 { width: 446px; margin: 0 auto 30px;}
.cont .box02 .bnr03 { width: 440px; margin: 0 auto 30px;}
.cont .box02 .bnr04 { width: 446px; margin: 0 auto;}
.cont .box02 .bnr05 { width: 442px; margin: -8px auto 30px;}
.cont .box02 .bnr06 { width: 440px; margin: 0 auto 30px;}
.cont .box02 .bnr07 { width: 440px; margin: 0 auto 30px;}
.cont .box02 .bnr08 { width: 440px; margin: 0 auto 80px;}

.cont .box02 .bnr a { display: block;}
.cont .box02 .bnr a:hover { transform: translateY( 5px);}
.cont .box02 .bnr a:hover img {opacity: 1.0;}

.cont .box02 .cloud { position: absolute; z-index: 10;}
.cont .box02 .cloud01 { width: 258px; top: 130px; left: -50px;}
.cont .box02 .cloud02 { width: 406px; top: 440px; left: 180px;}
.cont .box02 .cloud03 { width: 325px; top: 1060px; left: 220px;}
.cont .box02 .cloud04 { width: 435px; top: 1380px; left: -110px;}
.cont .box02 .cloud05 { width: 264px; top: 1580px; left: 320px;}


}



/*PC*/
/*@media print, screen and (min-width: 769px) and ( max-width: 1919px) {}*/



/*sp*/
@media only screen and (max-width: 768px) {

.smart { background: #90cfca url("../images/index/bg.png") 0 0 no-repeat !important; background-size: 100% !important;}
.smart::before { content: none;}
.smart::after  { content: none;}


.smart .logo { width: 238px !important; position: absolute !important; top: 2.041vw; left: 2.041vw;}

.cont {}
.cont .box01 { min-height: calc( 100vh - 12.245vw ); height: 183.673vw; position: relative;}
.cont .box01 .figure_main01 { position: absolute; z-index: 10; top: -15.51vw; left: 18.163vw; width:  11.633vw;}
.cont .box01 .figure_main02 { position: absolute; z-index: 10; top:  4.694vw; left: -2.449vw; width:  14.49vw;}
.cont .box01 .figure_main03 { position: absolute; z-index: 10; top:  -6.122vw; left: 38.163vw; width:  18.776vw;}
.cont .box01 .figure_main04 { position: absolute; z-index: 10; top: -24.49vw; left: 48.98vw; width: 37.143vw;}
.cont .box01 .figure_main05 { position: absolute; z-index: 10; top:  -5.714vw; left: 56.531vw; width:  20vw;}
.cont .box01 .figure_main06 { position: absolute; z-index: 10; top:    0px; left: 26.939vw; width:  19.796vw;}
.cont .box01 .figure_main07 { position: absolute; z-index: 10; top: 11.837vw; left: -23.878vw; width: 37.143vw;}
.cont .box01 .figure_main08 { position: absolute; z-index: 11; top:  22.449vw; left: -6.939vw; width:  18.776vw;}
.cont .box01 .figure_main09 { position: absolute; z-index: 10; top:  32.653vw; left: -6.122vw; width:  65px}
.cont .box01 .figure_main10 { position: absolute; z-index: 10; top:  20.408vw; left: 89.796vw; width:  5.714vw;}

.cont .box01 .figure_main11 { position: absolute; z-index: 10; top: 36.735vw; left: 93.061vw; width:  14.082vw;}
.cont .box01 .figure_main12 { position: absolute; z-index: 10; top: 101.633vw; left: 78.163vw; width:  14.694vw;}
.cont .box01 .figure_main13 { position: absolute; z-index: 10; top: 86.939vw; left: 86.939vw; width: 29.184vw;}
.cont .box01 .figure_main14 { position: absolute; z-index: 10; top: 105.918vw; left: 89.388vw; width:  15.714vw;}
.cont .box01 .figure_main15 { position: absolute; z-index: 10; top: 117.551vw; left: 4.082vw; width:  2.449vw;}
.cont .box01 .figure_main16 { position: absolute; z-index: 10; top: 124.49vw; left: 31.633vw; width:  7.347vw;}
.cont .box01 .figure_main17 { position: absolute; z-index: 10; top: 120.408vw; left: -10.204vw; width:  19.796vw;}
.cont .box01 .figure_main18 { position: absolute; z-index: 10; top: 129.796vw; left: 1.633vw; width:  14.49vw;}
.cont .box01 .figure_main19 { position: absolute; z-index: 10; top: 131.837vw; left: 49.796vw; width:  11.429vw;}
.cont .box01 .figure_main20 { position: absolute; z-index: 10; top: 144.082vw; left: 46.327vw; width:  4.286vw;}

.cont .box01 .figure_main21 { position: absolute; z-index: 10; top: 137.143vw; left: -20vw; width: 37.143vw;}
.cont .box01 .figure_main22 { position: absolute; z-index: 10; top: 147.347vw; left: -2.449vw; width:  18.776vw;}
.cont .box01 .figure_main23 { position: absolute; z-index: 10; top: 132.245vw; left: 90.204vw; width:  19.796vw;}
.cont .box01 .figure_main24 { position: absolute; z-index: 10; top: 167.959vw; left: 45.918vw; width:  7.551vw;}
.cont .box01 .figure_main25 { position: absolute; z-index: 10; top: 151.429vw; left: 86.327vw; width:  19.796vw;}
.cont .box01 .figure_main26 { position: absolute; z-index: 10; top: 162.449vw; left: 82.449vw; width:  18.776vw;}
.cont .box01 .figure_main27 { position: absolute; z-index: 10; top: 160.816vw; left: 95.918vw; width:  14.694vw;}


.cont .box01 .staff01 { position: absolute; z-index: 40; top: -3.469vw; left: 55.918vw; width: 37.347vw;}
.cont .box01 .staff02 { position: absolute; z-index: 40; top: 107.551vw; left: 55.918vw; width: 36.327vw;}
.cont .box01 .staff03 { position: absolute; z-index: 40; top: 134.286vw; left:  11.633vw; width: 36.939vw;}

.cont .box01 .txt01 { position: absolute; z-index: 30; top: 27.755vw; left: 8.367vw; width: 83.878vw;}


.cont .box02 { position: relative;}
.cont .box02 .bnr { position: relative; z-index: 50;}
.cont .box02 .bnr01 { width: 89.796vw; margin: 0 auto 6.122vw;}
.cont .box02 .bnr02 { width: 91.02vw; margin: 0 auto 6.122vw;}
.cont .box02 .bnr03 { width: 89.796vw; margin: 0 auto 6.122vw;}
.cont .box02 .bnr04 { width: 91.02vw; margin: 0 auto;}
.cont .box02 .bnr05 { width: 90.204vw; margin: -1.633vw auto 6.122vw;}
.cont .box02 .bnr06 { width: 89.796vw; margin: 0 auto 6.122vw;}
.cont .box02 .bnr07 { width: 89.796vw; margin: 0 auto 6.122vw;}
.cont .box02 .bnr08 { width: 89.796vw; margin: 0 auto 16.327vw;}

.cont .box02 .bnr a { display: block;}
.cont .box02 .bnr a:hover { transform: translateY( 5px);}
.cont .box02 .bnr a:hover img {opacity: 1.0;}

.cont .box02 .cloud { position: absolute; z-index: 10;}
.cont .box02 .cloud01 { width: 52.653vw; top: 26.531vw; left: -10.204vw;}
.cont .box02 .cloud02 { width: 82.857vw; top: 89.796vw; left: 36.735vw;}
.cont .box02 .cloud03 { width: 66.327vw; top: 216.327vw; left: 44.898vw;}
.cont .box02 .cloud04 { width: 88.776vw; top: 281.633vw; left: -22.449vw;}
.cont .box02 .cloud05 { width: 53.878vw; top: 322.449vw; left: 65.306vw;}



}



/*sp*/
@media screen and (width: 490px) {

.smart { background: #90cfca url("../images/index/bg.png") 0 0 no-repeat !important; background-size: 100% !important;}
.smart::before { content: none;}
.smart::after  { content: none;}


.smart .logo { width: 238px !important; position: absolute !important; top: 10px; left: 10px;}

.cont {}
.cont .box01 { min-height: calc( 100vh - 60px ); height: 900px; position: relative;}
.cont .box01 .figure_main01 { position: absolute; z-index: 10; top: -76px; left: 89px; width:  57px;}
.cont .box01 .figure_main02 { position: absolute; z-index: 10; top:  23px; left: -12px; width:  71px;}
.cont .box01 .figure_main03 { position: absolute; z-index: 10; top:  -30px; left: 187px; width:  92px;}
.cont .box01 .figure_main04 { position: absolute; z-index: 10; top: -120px; left: 240px; width: 182px;}
.cont .box01 .figure_main05 { position: absolute; z-index: 10; top:  -28px; left: 277px; width:  98px;}
.cont .box01 .figure_main06 { position: absolute; z-index: 10; top:    0px; left: 132px; width:  97px;}
.cont .box01 .figure_main07 { position: absolute; z-index: 10; top: 58px; left: -117px; width: 182px;}
.cont .box01 .figure_main08 { position: absolute; z-index: 11; top:  110px; left: -34px; width:  92px;}
.cont .box01 .figure_main09 { position: absolute; z-index: 10; top:  160px; left: -30px; width:  65px}
.cont .box01 .figure_main10 { position: absolute; z-index: 10; top:  100px; left: 440px; width:  28px;}

.cont .box01 .figure_main11 { position: absolute; z-index: 10; top: 180px; left: 456px; width:  69px;}
.cont .box01 .figure_main12 { position: absolute; z-index: 10; top: 498px; left: 383px; width:  72px;}
.cont .box01 .figure_main13 { position: absolute; z-index: 10; top: 426px; left: 426px; width: 143px;}
.cont .box01 .figure_main14 { position: absolute; z-index: 10; top: 519px; left: 438px; width:  77px;}
.cont .box01 .figure_main15 { position: absolute; z-index: 10; top: 576px; left: 20px; width:  12px;}
.cont .box01 .figure_main16 { position: absolute; z-index: 10; top: 610px; left: 155px; width:  36px;}
.cont .box01 .figure_main17 { position: absolute; z-index: 10; top: 590px; left: -50px; width:  97px;}
.cont .box01 .figure_main18 { position: absolute; z-index: 10; top: 636px; left: 8px; width:  71px;}
.cont .box01 .figure_main19 { position: absolute; z-index: 10; top: 646px; left: 244px; width:  56px;}
.cont .box01 .figure_main20 { position: absolute; z-index: 10; top: 706px; left: 227px; width:  21px;}

.cont .box01 .figure_main21 { position: absolute; z-index: 10; top: 672px; left: -98px; width: 182px;}
.cont .box01 .figure_main22 { position: absolute; z-index: 10; top: 722px; left: -12px; width:  92px;}
.cont .box01 .figure_main23 { position: absolute; z-index: 10; top: 648px; left: 442px; width:  97px;}
.cont .box01 .figure_main24 { position: absolute; z-index: 10; top: 823px; left: 225px; width:  37px;}
.cont .box01 .figure_main25 { position: absolute; z-index: 10; top: 742px; left: 423px; width:  97px;}
.cont .box01 .figure_main26 { position: absolute; z-index: 10; top: 796px; left: 404px; width:  92px;}
.cont .box01 .figure_main27 { position: absolute; z-index: 10; top: 788px; left: 470px; width:  72px;}


.cont .box01 .staff01 { position: absolute; z-index: 40; top: -17px; left: 274px; width: 183px;}
.cont .box01 .staff02 { position: absolute; z-index: 40; top: 527px; left: 274px; width: 178px;}
.cont .box01 .staff03 { position: absolute; z-index: 40; top: 658px; left:  57px; width: 181px;}

.cont .box01 .txt01 { position: absolute; z-index: 30; top: 136px; left: 41px; width: 411px;}


.cont .box02 { position: relative;}
.cont .box02 .bnr { position: relative; z-index: 50;}
.cont .box02 .bnr01 { width: 440px; margin: 0 auto 30px;}
.cont .box02 .bnr02 { width: 446px; margin: 0 auto 30px;}
.cont .box02 .bnr03 { width: 440px; margin: 0 auto 30px;}
.cont .box02 .bnr04 { width: 446px; margin: 0 auto;}
.cont .box02 .bnr05 { width: 442px; margin: -8px auto 30px;}
.cont .box02 .bnr06 { width: 440px; margin: 0 auto 30px;}
.cont .box02 .bnr07 { width: 440px; margin: 0 auto 30px;}
.cont .box02 .bnr08 { width: 440px; margin: 0 auto 80px;}

.cont .box02 .bnr a { display: block;}
.cont .box02 .bnr a:hover { transform: translateY( 5px);}
.cont .box02 .bnr a:hover img {opacity: 1.0;}

.cont .box02 .cloud { position: absolute; z-index: 10;}
.cont .box02 .cloud01 { width: 258px; top: 130px; left: -50px;}
.cont .box02 .cloud02 { width: 406px; top: 440px; left: 180px;}
.cont .box02 .cloud03 { width: 325px; top: 1060px; left: 220px;}
.cont .box02 .cloud04 { width: 435px; top: 1380px; left: -110px;}
.cont .box02 .cloud05 { width: 264px; top: 1580px; left: 320px;}


}