@import url('commsset.css');
@import url('burger_menu3.css');

.msg{ font-size:1em;}
#msg001{ border: 1px solid #b5cbaa; width:90%; max-width:800px; margin:15px 5% 20px 5%; font-size:1em;text-align: left;
    padding:20px 10px 20px 10px;border-radius:6px 6px 6px 6px / 6px 6px 6px 6px ;
    -webkit-order: 2;-ms-flex-order: 2;order: 2;
    -webkit-flex: 0 1 auto;-ms-flex: 0 1 auto;flex: 0 1 auto;
    -webkit-align-self: auto;-ms-flex-item-align: auto;align-self: auto;
}

#ctgy_box2{ position:relative; border: 2px solid #db5959; width:100%; height:auto; margin-top:30px; padding:3px 3px 3px 3px;
    -webkit-order: 5;-ms-flex-order: 5;order: 5;
    -webkit-flex: 0 1 auto;-ms-flex: 0 1 auto;flex: 0 1 auto;
    -webkit-align-self: auto;-ms-flex-item-align: auto;align-self: auto;
    /*
   border-radius:5px 5px 5px / 5px 5px 5px 5px; 
   box-shadow:-2px -2px 1px #bbd5d6, 2px 2px 2px #ddfeff;
   */
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -webkit-flex-direction: row;
    -ms-flex-direction: row;
    flex-direction: row;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-align-content: stretch;
    -ms-flex-line-pack: stretch;
    align-content: stretch;
    -webkit-align-items: flex-start;
    -ms-flex-align: start;
    align-items: flex-start;
}

      /*.sec_title_sub{border: 1px solid #d5af00; width:100%;font-size:0.875em; color:#939393; text-align:center;}  */    
	.contcase{ position:relative; border: 1px solid #9b9b9b; width:280px/*98.778 mm*/;top:15px;height:315px/*111.125 mm*/;left:10px;
	  background-size:contain;
	   -webkit-border-radius: 3px 3px 3px 3px / 3px 3px 3px 3px;
       -o-border-radius: 3px 3px 3px 3px / 3px 3px 3px 3px;
       -ms-border-radius: 3px 3px 3px 3px / 3px 3px 3px 3px;
       border-radius:3px 3px 3px 3px / 3px 3px 3px 3px;

       box-shadow:-2px -2px 2px #909090, 1px 1px 2px #d0d0d0;
       background-repeat:no-repeat;/*background-size:contain;*/ background-color:#ffffff;
}
  .contcase_ads{ position: relative; border: 1px solid #9b9b9b; width:300px;top:15px; height:315px; left:0;/* margin: 50px 0px 10px 0px;*/
        background-color:#ffffff
        /*-webkit-border-radius:6px 6px 6px 6px / 6px 6px 6px 6px; border-radius:6px 6px 6px 6px / 6px 6px 6px 6px;
        box-shadow:-2px -2px 2px #e4fffe, 3px 3px 3px #5c5c5c;
       /* background-color:#dadde6/*#e6f6f0;*/
}
      /*ads*/
      #contcase_01{ background-image: url('../images/06/0601_003.jpg')}/*1.*/
      #contcase_02{ background-image: url('../images/06/06_02.jpg');}/*2.*/
    /*#contcase_03{ background-image: none;}/*ads*/
      #contcase_04{ background-image: url('../images/06/06_03.jpg');}/*3.*/
      #contcase_05{ background-image: url('../images/06/06_04.jpg');}/*4.*/
    /*#contcase_06{ background-image: none;}/*ads*/
      #contcase_07{ background-image: url('../images/06/06_05.jpg');}/*5.*/
      #contcase_08{ background-image: none;}/*6.*/
    /*#contcase_09{ background-image: none;}/*ads*/
      #contcase_10{ background-image: url('../images/06/06_07.jpg');}/*7.*/
      #contcase_11{ background-image: url('../images/06/06_08.jpg');}/*8.*/
    /*#contcase_12{ background-image: none;}/*ads*/
      #contcase_13{ background-image: url('../images/06/0609_001.png');}/*9.*/
      #contcase_14{ background-image: url('../06_web_code_memo/demo/images/06_10.jpg');}/*10.*/
    /*#contcase_15{ background-image: none;}/*ads*/
      #contcase_16{ background-image: none;}/*11.*/
      #contcase_17{ background-image: none;}/*12.*/
    /*#contcase_18{ background-image: none;}/*ads*/
      #contcase_19{ background-image: none;}
      #contcase_20{ background-image: none;}
      
    #ctg01{
	-webkit-order: 0; -ms-flex-order: 0; order: 0;
    -webkit-flex: 0 0 auto; -ms-flex: 0 0 auto; flex: 0 0 auto;
    -webkit-align-self: auto; -ms-flex-item-align: auto; align-self: auto;
}
    #ctg02{
	-webkit-order: 1; -ms-flex-order: 1; order: 1;
    -webkit-flex: 0 0 auto; -ms-flex: 0 0 auto; flex: 0 0 auto;
    -webkit-align-self: auto; -ms-flex-item-align: auto; align-self: auto;
}
    #ctg03{
	-webkit-order: 2; -ms-flex-order: 2; order: 2;
    -webkit-flex: 0 0 auto; -ms-flex: 0 0 auto; flex: 0 0 auto;
    -webkit-align-self: auto; -ms-flex-item-align: auto; align-self: auto;
}
    #ctg04{
	-webkit-order: 3; -ms-flex-order: 3; order: 3;
    -webkit-flex: 0 0 auto; -ms-flex: 0 0 auto; flex: 0 0 auto;
    -webkit-align-self: auto; -ms-flex-item-align: auto; align-self: auto;
}
    #ctg05{
	-webkit-order: 4; -ms-flex-order: 4; order: 4;
    -webkit-flex: 0 0 auto; -ms-flex: 0 0 auto; flex: 0 0 auto;
    -webkit-align-self: auto; -ms-flex-item-align: auto; align-self: auto;
}
    #ctg06{
	-webkit-order: 5; -ms-flex-order: 5; order: 5;
    -webkit-flex: 0 0 auto; -ms-flex: 0 0 auto; flex: 0 0 auto;
    -webkit-align-self: auto; -ms-flex-item-align: auto; align-self: auto;
}
    #ctg07{
	-webkit-order: 6; -ms-flex-order: 6; order: 6;
    -webkit-flex: 0 0 auto; -ms-flex: 0 0 auto; flex: 0 0 auto;
    -webkit-align-self: auto; -ms-flex-item-align: auto; align-self: auto;
}
    #ctg08{
	-webkit-order: 7; -ms-flex-order: 7; order: 7;
    -webkit-flex: 0 0 auto; -ms-flex: 0 0 auto; flex: 0 0 auto;
    -webkit-align-self: auto; -ms-flex-item-align: auto; align-self: auto;
}

     
 #loadingbox{/*border: 1px solid #9b9b9b;*/position: absolute; width: 170px; height: 170px; z-index: 3; top: 70px; left: 50%; margin-left:-85px;}
 #msg{position: absolute; width:100%; height: 24px; z-index: 3; top: 75px; left:0px; text-align:center; font-size:14px; font-weight:100; color:#088f00;}
 .dot{position: absolute; width: 5px; height: 5px; z-index: 4; background-color:#0001ff;border-radius:2.5px 2.5px 2.5px 2.5px / 2.5px 2.5px 2.5px 2.5px;}
 #dot01{ top: 35%; left: 48.2%;animation: flash_a 1s 0s linear infinite;}
 #dot02{ bottom: 35%; left: 48.2%;animation: flash_a 1s 0.5s linear infinite;}
 #core{/*border: 1px solid #9b9b9b;*/position: absolute; width: 100px; height: 100px; z-index: 2; top: 35px; left: 35px;animation: spin 3s linear infinite;}
  .ball{position: absolute; width: 30%; height: 30%; z-index: 2;border-radius:50% 50% 50% 50% / 50% 50% 50% 50%; opacity:0.5; }	
  #ball001{top: -35%; left: 35%; background-color:#515151;}
  #ball002{top: -26%; left: 70%; background-color:#5b5b5b;}
  #ball003{top: 0%; left: 96%;background-color:#5b5b5b;}
  #ball004{top: 35%; left: 105%;background-color:#656565;}
  #ball005{top: 70%; left: 96%;background-color:#6f6f6f;}
  #ball006{top: 96%; left: 70%;background-color:#797979;}
  #ball007{top: 105%; left: 35%;background-color:#838383;}
  #ball008{top: 96%; left: 0%;background-color:#8d8d8d;}
  #ball009{top: 70%; left: -26%;background-color:#979797;}
  #ball010{top: 35%; left: -35%;background-color:#a1a1a1;}
  #ball011{top: 0%; left: -26%;background-color:#ababab;}
  #ball012{top: -26%; left: 0%;background-color:#b5b5b5;}
@keyframes spin {from{transform: rotate(360deg);}to{transform: rotate(0);}}
@keyframes flash_a {0%{opacity:0;}15% {opacity:1;}35%{opacity:1;}100%{opacity:0;}}


    #ctg09{
	-webkit-order: 8; -ms-flex-order: 8; order: 8;
    -webkit-flex: 0 0 auto; -ms-flex: 0 0 auto; flex: 0 0 auto;
    -webkit-align-self: auto; -ms-flex-item-align: auto; align-self: auto;
}
    #ctg10{
	-webkit-order: 9; -ms-flex-order: 9; order: 9;
    -webkit-flex: 0 0 auto; -ms-flex: 0 0 auto; flex: 0 0 auto;
    -webkit-align-self: auto; -ms-flex-item-align: auto; align-self: auto;
}
    #ctg11{
	-webkit-order: 10; -ms-flex-order: 10; order: 10;
    -webkit-flex: 0 0 auto; -ms-flex: 0 0 auto; flex: 0 0 auto;
    -webkit-align-self: auto; -ms-flex-item-align: auto; align-self: auto;
}
    #ctg12{
	-webkit-order: 11; -ms-flex-order: 11; order: 11;
    -webkit-flex: 0 0 auto; -ms-flex: 0 0 auto; flex: 0 0 auto;
    -webkit-align-self: auto; -ms-flex-item-align: auto; align-self: auto;
}
    #ctg13{
	-webkit-order: 12; -ms-flex-order: 12; order: 12;
    -webkit-flex: 0 0 auto; -ms-flex: 0 0 auto; flex: 0 0 auto;
    -webkit-align-self: auto; -ms-flex-item-align: auto; align-self: auto;
}
    #ctg14{
	-webkit-order: 13; -ms-flex-order: 13; order: 13;
    -webkit-flex: 0 0 auto; -ms-flex: 0 0 auto; flex: 0 0 auto;
    -webkit-align-self: auto; -ms-flex-item-align: auto; align-self: auto;
}
    #ctg15{
	-webkit-order: 14; -ms-flex-order: 14; order: 14;
    -webkit-flex: 0 0 auto; -ms-flex: 0 0 auto; flex: 0 0 auto;
    -webkit-align-self: auto; -ms-flex-item-align: auto; align-self: auto;
}
    #ctg16{
	-webkit-order: 15; -ms-flex-order: 15; order: 15;
    -webkit-flex: 0 0 auto; -ms-flex: 0 0 auto; flex: 0 0 auto;
    -webkit-align-self: auto; -ms-flex-item-align: auto; align-self: auto;
}
    #ctg17{
	-webkit-order: 16; -ms-flex-order: 16; order: 16;
    -webkit-flex: 0 0 auto; -ms-flex: 0 0 auto; flex: 0 0 auto;
    -webkit-align-self: auto; -ms-flex-item-align: auto; align-self: auto;
}
    #ctg18{
	-webkit-order: 17; -ms-flex-order: 17; order: 17;
    -webkit-flex: 0 0 auto; -ms-flex: 0 0 auto; flex: 0 0 auto;
    -webkit-align-self: auto; -ms-flex-item-align: auto; align-self: auto;
}
    #ctg19{
	-webkit-order: 18; -ms-flex-order: 18; order: 18;
    -webkit-flex: 0 0 auto; -ms-flex: 0 0 auto; flex: 0 0 auto;
    -webkit-align-self: auto; -ms-flex-item-align: auto; align-self: auto;
}
    #ctg20{
	-webkit-order: 19; -ms-flex-order: 19; order: 19;
    -webkit-flex: 0 0 auto; -ms-flex: 0 0 auto; flex: 0 0 auto;
    -webkit-align-self: auto; -ms-flex-item-align: auto; align-self: auto;
}