/*pc***********************************************************/
	@media all and (min-width:990px) {  
        html,body,#wrap{height:100%}

        #wrap{;background:url('/images/main/main_bg.jpg') no-repeat center;background-size:cover;overflow:hidden}        
        
        
        #main{position:absolute;width:100%;;height:100%}
        
        .bg_area{position:absolute;width:100%;height:100%;z-index:10;opacity:0;transition:0.3s}
        .bg_area.on{opacity:1;transition:0.3s}
        .bg_area .cover{position:absolute;left:0;top:0;width:100%;height:100%;background:rgba(0,0,0,0.5);z-index:10}
        .bg_area .bg1{position:absolute;left:0;top:0;width:100%;height:100%;background:url('/images/main/main_bg1.jpg') no-repeat center;background-size:cover;opacity:0;transition:0.3s}
        .bg_area .bg1.on{opacity:1;transition:0.3s}
        .bg_area .bg2{position:absolute;left:0;top:0;width:100%;height:100%;background:url('/images/main/main_bg2.jpg') no-repeat center;background-size:cover;opacity:0;transition:0.3s}
        .bg_area .bg2.on{opacity:1;transition:0.3s}
        .bg_area .bg3{position:absolute;left:0;top:0;width:100%;height:100%;background:url('/images/main/main_bg3.jpg') no-repeat center;background-size:cover;opacity:0;transition:0.3s}
        .bg_area .bg3.on{opacity:1;transition:0.3s}
        
        .menu_area{position:relative;top:50%;width:920px;margin:0 auto;margin-top:-300px;letter-spacing:-0.5px;z-index:20}
        
        .m_sec1{float:left;}
        .m_sec1 .box{position:relative}
        .m_sec1 .box .over{position:absolute;left:0;top:0;width:100%;height:100%;background:url('/images/main/m_sec1_bg_on.png') no-repeat;opacity:0;transition:0.5s}
        .m_sec1 .box .info_area{position:absolute;left:0;top:0;width:100%;height:100%;z-index:10}
        .m_sec1 .box .info_area > a{display:block;height:100%}        
        .m_sec1 .box .info_area  .photo{display:block;position:absolute;right:-20px;bottom:10px}
        .m_sec1 .box .info_area  .photo img{max-width:none}
        .m_sec1 .box .info_area  .add{display:block;font-size:13px;color:#fff;padding:200px 30px 0;font-weight:100;line-height:1.2}
        .m_sec1 .box .info_area  .arrow{display:block;width:92%;height:20px;margin:20px 0;background:url('/images/main/m_sec1_arrow.png') no-repeat 30px center}  
        .m_sec1 .box:hover .over{opacity:1;transition:0.5s} 
        .m_sec1 .box:hover .arrow{background:url('/images/main/m_sec1_arrow_on.png') no-repeat 30px center}
        
        .m_sec2{float:left}
        .m_sec2 .box{position:relative;float:left;margin-left:10px;width:300px;height:100%}
        .m_sec2 .box .over{position:absolute;left:0;top:0;width:100%;height:100%;opacity:0;transition:0.5s}
        .m_sec2 .box.item1 .over{background:url('/images/main/m_sec2_bg1_on.jpg') no-repeat}        
        .m_sec2 .box.item2 .over{background:url('/images/main/m_sec2_bg2_on.jpg') no-repeat}   
        .m_sec2 .box .info_area{position:absolute;left:0;top:0;width:100%;height:100%;z-index:10;padding:10px}
        .m_sec2 .box .info_area > a{display:block;height:100%}    
        .m_sec2 .box .info_area strong{display:block;text-align:center;font-size:52px;font-weight:100;margin-top:30px;color:#000;line-height:1.2}
        .m_sec2 .box .info_area em{display:block;text-align:center;font-size:24px;color:#000;font-weight:700}
        .m_sec2 .box .info_area .bar{display:block;height:12px;background:url('/images/common/pattern_point.png');margin:10px 0}
        .m_sec2 .box .info_area .add{display:block;font-size:12px;color:#000;width:90%;margin:0 auto;line-height:1.2;text-align:center}
        .m_sec2 .box .info_area .arrow{display:block;width:92%;height:20px;margin:20px 0;background:url('/images/main/m_sec1_arrow2.png') no-repeat right center}  
        .m_sec2 .box:hover .over{opacity:1;transition:0.5s} 
        .m_sec2 .box:hover .arrow{background:url('/images/main/m_sec1_arrow2_on.png') no-repeat right center}
        .m_sec2 .box:hover .info_area *{color:#fff}
        
        
        
        #popup{display:none;position:absolute;left:0;top:0;width:100%;height:100%;z-index:100}
        #popup.on{display:block}    
        #popup .bg{position:absolute;left:0;top:0;width:100%;height:100%;background:rgba(0,0,0,0.6)}
        #popup .box{position:relative;width:1000px;height:80%;top:10%;margin:0 auto;background:#fff;overflow:auto}
        #popup .close{position:absolute;right:20px;top:20px;cursor:pointer}
        #popup  h2{background:url('/images/main/popup_tit_bg.gif') no-repeat;height:298px;font-weight:200;padding-left:38%}
        #popup  h2 .tit{font-size:66px;color:#fff;padding-top:20px}
        #popup  h2 .add{color:#fff;text-align:center;font-size:16px;line-height:1.2;padding:30px 50px}

        #popup  .menu{padding:0 40px}
        #popup  .menu li{margin-bottom:45px;text-align:center}
        #popup  .menu li strong{display:block;font-size:35px;color:#fff;font-weight:300;line-height:1;letter-spacing:-2px}
        #popup  .menu li .add{display:block;font-size:16px;color:#fff;line-height:1.2;padding:0 10%;letter-spacing:-1px}
        #popup  .menu .item1{float:left;width:270px;height:270px;background:url('/images/main/popup_ico1.png') no-repeat 10px 20px #ed842e;margin-left:0}
        #popup  .menu .item1 strong{margin-left:70px;margin-top:70px}
        #popup  .menu .item1 .add{margin-top:45px}
        #popup  .menu .item2{float:left;width:270px;height:270px;background:url('/images/main/popup_ico2.png') no-repeat 70% center #3badb4;margin-left:44px}
        #popup  .menu .item2 strong{margin-top:15px;}
        #popup  .menu .item2 .add{margin-top:105px}
        #popup  .menu .item3{float:left;width:270px;height:270px;background:url('/images/main/popup_ico3.png') no-repeat center 20px #5479b1;margin-left:44px;}
        #popup  .menu .item3 strong{margin-top:100px}
        #popup  .menu .item3 .add{margin-top:15px}    
        #popup  .menu .item4{display:table;background:#de407c;background-size:cover;width:100%;clear:both}
        #popup  .menu .item4 .thumb{display:table-cell;width:370px}
        #popup  .menu .item4 a{display:table-cell;background:url('/images/main/popup_menu_bg4.jpg') no-repeat;background-size:cover;vertical-align:top;text-align:left;padding-top:60px;padding-left:60px}
        #popup  .menu .item4 a strong i{color:#fcfebf}
        #popup  .menu .item4 a .add{padding:10px 0}

        #popup  .menu .item5{display:table;background:#9b6ccb;width:100%;}
        #popup  .menu .item5 .thumb{display:table-cell;width:416px}
        #popup  .menu .item5 a{display:table-cell;background:url('/images/main/popup_menu_bg5.jpg') no-repeat;background-size:cover;vertical-align:top;text-align:left;padding-top:60px;padding-left:60px}
        #popup  .menu .item5 a .add{padding:10px 60px 0 0}

        #popup .review{border:1px solid #ddd;margin:40px;padding:20px}
        #popup .review strong{color:#123c9c;font-size:30px;letter-spacing:-2px;font-weight:300}
        #popup .review .pattern{height:12px;background:url('/images/common/pattern_point.png');margin:15px 0 0}
        #popup .review li{padding:10px 30px;border-top:1px dotted #aaa}
        #popup .review li:first-child{border-top:none}
        #popup .review .star_point{background:url('/images/main/popup_ico_star.gif') no-repeat;height:19px}
        #popup .review .name{color:#000;font-size:18px;margin-top:5px}
        #popup .review .name span{color:#2961bc;font-size:16px;margin-left:5px}
        #popup .review .memo{font-size:14px;color:#686767}
        
    }    
    


	/*mobile***********************************************************/
	@media all and (max-width:989px) {  
        #wrap{;background:url('/images/main/main_bg.jpg') no-repeat center;background-size:cover;overflow:hidden;padding:0 2%}
        #main{letter-spacing:-0.5px}
        
        .m_sec1{margin-top:2%}
        .m_sec1 .box{position:relative}
        .m_sec1 .box .over{position:absolute;left:0;top:0;width:100%;height:100%;background:url('/images/main/m_sec1_bg_on.png') no-repeat;opacity:0;transition:0.5s}
        .m_sec1 .box .info_area{position:absolute;left:0;top:0;width:100%;height:100%;z-index:10}
        .m_sec1 .box .info_area > a{display:block;height:100%}        
        .m_sec1 .box .info_area  .photo{display:block;position:absolute;right:10px;bottom:10px}
        .m_sec1 .box .info_area  .photo img{max-width:none}
        .m_sec1 .box .info_area  .add{display:block;font-size:13px;color:#fff;padding:200px 30px 0;font-weight:100;line-height:1.2}
        .m_sec1 .box .info_area  .arrow{display:block;width:92%;height:20px;margin:20px 0;background:url('/images/main/m_sec1_arrow.png') no-repeat 30px center}  
        .m_sec1 .box:hover .over{opacity:1;transition:0.5s} 
        .m_sec1 .box:hover .arrow{background:url('/images/main/m_sec1_arrow_on.png') no-repeat 30px center}
        
        .m_sec2{margin-top:2%}
        .m_sec2 .box{position:relative;float:left;margin-left:2%;width:49%;height:100%}
        .m_sec2 .box:first-child{margin-left:0}
        .m_sec2 .box .over{position:absolute;left:0;top:0;width:100%;height:100%;opacity:0;transition:0.5s}
        .m_sec2 .box.item1 .over{background:url('/images/main/m_sec2_bg1_on.jpg') no-repeat;background-size:cover}        
        .m_sec2 .box.item2 .over{background:url('/images/main/m_sec2_bg2_on.jpg') no-repeat;background-size:cover}   
        .m_sec2 .box .info_area{position:absolute;left:0;top:0;width:100%;height:100%;z-index:10;padding:5px}
        .m_sec2 .box .info_area > a{display:block;height:100%}    
        .m_sec2 .box .info_area strong{display:block;text-align:center;font-size:24px;font-weight:100;margin-top:10px;color:#000;line-height:1.2}
        .m_sec2 .box .info_area em{display:block;text-align:center;font-size:14px;color:#000;font-weight:700}
        .m_sec2 .box .info_area .bar{display:block;height:8px;background:url('/images/common/pattern_point.png');margin:10px 0}
        .m_sec2 .box .info_area .add{display:block;font-size:11px;color:#000;width:90%;margin:0 auto;line-height:1.2;text-align:center}
        .m_sec2 .box .info_area .arrow{display:block;width:92%;height:20px;margin:12px 0;background:url('/images/main/m_sec1_arrow2.png') no-repeat right center;background-size:20px}  
        .m_sec2 .box:hover .over{opacity:1;transition:0.5s} 
        .m_sec2 .box:hover .arrow{background:url('/images/main/m_sec1_arrow2_on.png') no-repeat right center;background-size:40px}
        .m_sec2 .box:hover .info_area *{color:#fff}
        
        
        
        #popup{display:none;position:absolute;left:0;top:0;width:100%;height:100%;z-index:100}
        #popup.on{display:block}    
        #popup .bg{position:absolute;left:0;top:0;width:100%;height:100%;background:rgba(0,0,0,0.6)}
        #popup .box{position:relative;width:90%;height:90%;top:5%;margin:0 auto;background:#fff;overflow:auto}        
        #popup  h2{background:url('/images/main/popup_tit_bg.gif') no-repeat;background-size:cover;height:200px;font-weight:200;}
        #popup  h2 .tit{padding-top:20px;width:80%;margin-left:5%;}
        #popup  h2 .add{color:#fff;text-align:center;font-size:13px;line-height:1.2;padding:30px 30px;text-shadow:1px 1px #3c8868}
        #popup .close{position:absolute;right:15px;top:15px;width:25px;height:25px;cursor:pointer}

        #popup  .menu{padding:0 20px}
        #popup  .menu li{margin-bottom:20px !important;text-align:center}
        #popup  .menu li strong{display:block;font-size:35px;color:#fff;font-weight:300;line-height:1;letter-spacing:-2px}
        #popup  .menu li .add{display:block;font-size:16px;color:#fff;line-height:1.2;padding:0 10%;letter-spacing:-1px}
        #popup  .menu .item1{width:270px;height:270px;background:url('/images/main/popup_ico1.png') no-repeat 10px 20px #ed842e;margin:0 auto;overflow:hidden}
        #popup  .menu .item1 strong{margin-left:70px;margin-top:70px}
        #popup  .menu .item1 .add{margin-top:45px}
        #popup  .menu .item2{width:270px;height:270px;background:url('/images/main/popup_ico2.png') no-repeat 70% center #3badb4;margin:0 auto;overflow:hidden}
        #popup  .menu .item2 strong{margin-top:15px;}
        #popup  .menu .item2 .add{margin-top:105px}
        #popup  .menu .item3{width:270px;height:270px;background:url('/images/main/popup_ico3.png') no-repeat center 20px #5479b1;margin:0 auto;overflow:hidden}
        #popup  .menu .item3 strong{margin-top:100px}
        #popup  .menu .item3 .add{margin-top:15px}    
        #popup  .menu .item4{}
        #popup  .menu .item4 .thumb{}
        #popup  .menu .item4 a{display:block;background:url('/images/main/popup_menu_bg4.jpg') no-repeat;background-size:cover;vertical-align:top;text-align:center;padding:10%}
        #popup  .menu .item4 a strong i{color:#fcfebf}
        #popup  .menu .item4 a .add{padding:10px 0}

        #popup  .menu .item5{}
        #popup  .menu .item5 .thumb{}
        #popup  .menu .item5 a{display:table-cell;background:url('/images/main/popup_menu_bg5.jpg') no-repeat;background-size:cover;vertical-align:top;text-align:left;padding:10%}
        #popup  .menu .item5 a .add{padding:10px 0}

        
}