﻿@import url('footor.css');

html{scroll-behavior: smooth;}
body { margin: 0; padding: 0;word-break:break-all; font-family:"メイリオ", Meiryo,"ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", Verdana, Roboto, "Droid Sans", "游ゴシック", YuGothic, "ＭＳ Ｐゴシック", sans-serif;}
.container { position: relative; width: 100%; height: auto; min-width:320px;padding-bottom:50px;
 /*flex-cont-01*/
    display: flex; flex-direction: column; flex-wrap: nowrap; justify-content: flex-start; align-content: stretch; align-items: center;
}
 #titleimgs{/*border: 1px solid #b5cbaa;*/ position: absolute; width:175px;height:147px; background-size:contain; background-image: url('../../images/01/titleimage0103.png');
              top:40px;left:30px; z-index:6; }
 .head{ /*border: 1px solid #b5cbaa;*/ width:100%; margin:0; height:50px; z-index:5;
	/*flex-item:01-1*/order: 0; flex: 0 0 auto; align-self: auto; 
	/*flex-cont-02*/display: flex; flex-direction: column; flex-wrap: nowrap; justify-content: flex-start; align-content: stretch; align-items: center;
 }
   h1{ position:absolute;/* border: 1px solid #b5cbaa;*/ font-size:17px; width: auto; margin:20px 0 0 0;
   /*flex-item:02-1*/order: 0; flex: 0 0 auto; align-self: auto;
   }
   h2{ position: absolute;/* border: 1px solid #b5cbaa;*/ font-size:14px; font-weight:normal; width: auto; margin:50px 0 0 0;   
   /*flex-item:02-2*/order: 1; flex: 0 0 auto; align-self: auto;
   }

 #topmsgbox{border: 1px solid #e9e9e9; width:calc(100% - 450px); height:auto; padding:15px; margin:40px 0 0 0;border-radius:20px;
	/*flex-item:01-2*/order: 1; flex: 0 0 auto; align-self: auto;
 }
 .ads_Horizon{/*border: 1px solid #b5cbaa;*/ width:90%; min-height:90px; height:auto; text-align: center; margin: 70px 0 0 0;
	/*flex-item:01-x*/flex: 0 0 auto; align-self: auto;
 }
   .adstitle{ position: relative; width: 150px; text-align:center; height:20px; z-index: 1; top: -20px; left:50%; margin-left:-75px; font-size:0.75em;color:#c1c1c1; 
   }

 .conentstitle{/*border: 1px solid #b5cbaa;*/ width:100%;height:30px; margin-top:30px;
	/*flex-item:01-x*/flex: 0 0 auto; align-self: auto;
	/*flex-cont-03*/  display: flex; flex-direction: row; flex-wrap: nowrap; justify-content: center; align-content: stretch; align-items: center;
 }
      .line{ height:5px; border: 1px solid #004425; border-radius:2.5px; margin:0 5% 0 5%; background-color:#00a65a;
      }
      .line01{/*flex-item:03-01*/ order: 0; flex: 2 2 auto;}
      .titlemsg{ border: 1px solid #004425;  width: auto; text-align:center;padding:3px 0 0 0; border-radius:20px; background-color:#00a65a; color:#ffffff;
                font-weight: 500; text-shadow: 1px 1px 1px rgba(0, 0, 0, 1);
              /*flex-item:03-02*/ order: 1; flex: 1 1 auto;}      
   	  .line02{/*flex-item:03-03*/ order: 2; flex: 2 2 auto;}
 .cotentsboxY{ border: 1px solid #c8c8c8; width:90%; height:auto; margin:30px 0 0 0; padding:0 0 10px 0;
	flex: 0 0 auto; align-self: auto;
	display: flex; flex-direction: row; flex-wrap: wrap; justify-content: center; align-content: stretch; align-items: flex-start;
	
	display: -ms-flexbox; display: -webkit-flex; display: flex;
	-webkit-flex-direction: column; -ms-flex-direction: column; flex-direction: column;
    -webkit-flex-wrap: nowrap; -ms-flex-wrap: nowrap; flex-wrap: nowrap;
    -webkit-justify-content: flex-start; -ms-flex-pack: start; justify-content: flex-start;
    -webkit-align-content: stretch; -ms-flex-line-pack: stretch; align-content: stretch;
    -webkit-align-items: center; -ms-flex-align: center; align-items: center;
 }
 .cotentsboxX{ /*border: 1px solid #002cff;*/ width:90%; height:auto; margin:30px 0 0 0; padding:0 0 30px 0;
	flex: 0 0 auto; align-self: auto;
	display: flex; flex-direction: row; flex-wrap: wrap; justify-content: center; align-content: stretch; align-items: flex-start;
	
    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; 
 }
 
 

  #ads01{order: 2; }        /*01-03*/
 #conentstitle01{order: 3;}/*01-04*/
  
 #cotentsbox01{order: 4;}  /*01-05*/ 
 #cotentsbox02{order: 5;}  /*01-06*/
 #cotentsbox03{order: 6;}  /*01-07*/ 
 #cotentsbox04{order: 7;}   
 #cotentsbox05{order: 8;} 
 #cotentsbox06{order: 9;} 
 #cotentsbox07{order: 10;}
 #cotentsbox08{order: 11;}
 #cotentsbox09{order: 12;}
 #cotentsbox10{order: 13;}
  #ads02{order: 14; }
        
 #conentstitle02{order: 15;}
 #cotentsbox11{order: 16;}
    
  .index{border: 1px solid #d9ecdd; width:calc(100% - 20px);height: auto; margin:20px 0 20px 0; padding:7px;/* background-color:#ecfaf2;*/border-radius: 10px;
    box-shadow: 4px 4px 9px -5px rgba(115, 145, 121, 0.4); 
	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: flex-start; -ms-flex-pack: start; justify-content: flex-start;
    -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;
    
    -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;
  } 
    .indexBox{border: 1px solid #6e6e6e; position: relative; width: auto;height: auto; padding:3px 20px 0 20px;  text-align:center;color:#ffffff;
    text-shadow: 1px 1px 1px rgba(0, 0, 0, 1);scroll-behavior: smooth;
    } 
    .indexTitle{background-color:#8f93a6;margin:0 0 0 30px;box-shadow: 2px 2px 2px 0px rgba(187, 186, 200, 1); border-radius: 12px; 
    }
    /*
    .indexTitleSub{background-color:#668979;margin:10px 50px 0 0;box-shadow: 2px 2px 2px 0px rgba(144, 172, 159, 1);border-radius: 0px 12px 12px 0px;
	}*/
    .items{/*border: 1px solid #fe3737;*/ width:auto;height:25px; padding:0 15px 0 15px; margin:7px;text-shadow: 0px 0px 1px rgba(7, 99, 247, 1); 
    background-color:#deece3;border-radius: 20px 0px 20px 0px;
     -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;
	}
	/*.items a{text-decoration:none; color:#000000; }*/
  .items a:link {color:#000000;text-decoration:none;}
  .items a:visited {color:#9400ff;} 
	.items:focus a,.items:hover a,.items:active a{ cursor:pointer; color:#ff0000; text-decoration:underline;text-shadow: 0px 0px 2px rgba(255, 197, 142, 1); background-color:#ffeec2;
	}
	
	
	
	#index01{-webkit-order: 0; -ms-flex-order: 0; order: 0;}
	#index02{-webkit-order: 1; -ms-flex-order: 1; order: 1;}
	#index03{-webkit-order: 2; -ms-flex-order: 2; order: 2;}
	#index04{-webkit-order: 3; -ms-flex-order: 3; order: 3;}
	#index05{-webkit-order: 4; -ms-flex-order: 4; order: 4;}
	#index06{-webkit-order: 5; -ms-flex-order: 5; order: 5;}
	#index07{-webkit-order: 6; -ms-flex-order: 6; order: 6;}
	#index08{-webkit-order: 7; -ms-flex-order: 7; order: 7;}
	#index09{-webkit-order: 8; -ms-flex-order: 8; order: 8;}
	#index10{-webkit-order: 9; -ms-flex-order: 9; order: 9;}
	#index11{-webkit-order: 10; -ms-flex-order: 10; order: 10;}
	#index12{-webkit-order: 11; -ms-flex-order: 11; order: 11;}
	#index13{-webkit-order: 12; -ms-flex-order: 12; order: 12;}
	#index14{-webkit-order: 13; -ms-flex-order: 13; order: 13;}
	#index15{-webkit-order: 14; -ms-flex-order: 14; order: 14;}
	#index16{-webkit-order: 15; -ms-flex-order: 15; order: 15;}
	#index17{-webkit-order: 16; -ms-flex-order: 16; order: 16;}
	
      #item01{-webkit-order: 0; -ms-flex-order: 0; order: 0;}
      #item02{-webkit-order: 1; -ms-flex-order: 1; order: 1;}
      #item03{-webkit-order: 2; -ms-flex-order: 2; order: 2;}
      #item04{-webkit-order: 3; -ms-flex-order: 3; order: 3;}
      #item05{-webkit-order: 4; -ms-flex-order: 4; order: 4;}
      #item06{-webkit-order: 5; -ms-flex-order: 5; order: 5;}
      #item07{-webkit-order: 6; -ms-flex-order: 6; order: 6;}
      #item08{-webkit-order: 7; -ms-flex-order: 7; order: 7;}
      #item09{-webkit-order: 8; -ms-flex-order: 8; order: 8;}
      #item10{-webkit-order: 9; -ms-flex-order: 9; order: 9;}
      #item11{-webkit-order: 10; -ms-flex-order: 10; order: 10;}
      #item12{-webkit-order: 11; -ms-flex-order: 11; order: 11;}
      #item13{-webkit-order: 12; -ms-flex-order: 12; order: 12;}
      #item14{-webkit-order: 13; -ms-flex-order: 13; order: 13;}
      #item15{-webkit-order: 14; -ms-flex-order: 14; order: 14;}
      #item16{-webkit-order: 15; -ms-flex-order: 15; order: 15;}
      #item17{-webkit-order: 16; -ms-flex-order: 16; order: 16;}
      #item18{-webkit-order: 17; -ms-flex-order: 17; order: 17;}
      #item19{-webkit-order: 18; -ms-flex-order: 18; order: 18;}
      #item20{-webkit-order: 19; -ms-flex-order: 19; order: 19;}
      #item21{-webkit-order: 20; -ms-flex-order: 20; order: 20;}
      #item22{-webkit-order: 21; -ms-flex-order: 21; order: 21;}
      #item23{-webkit-order: 22; -ms-flex-order: 22; order: 22;}
      #item24{-webkit-order: 23; -ms-flex-order: 23; order: 23;}
      #item25{-webkit-order: 24; -ms-flex-order: 24; order: 24;}
      #item26{-webkit-order: 25; -ms-flex-order: 25; order: 25;}
      #item27{-webkit-order: 26; -ms-flex-order: 26; order: 26;}
      #item28{-webkit-order: 27; -ms-flex-order: 27; order: 27;}
    
      .itemBox{ border: 1px solid #c1c3d8; width:450px; height:auto;margin:10px 10px 10px 10px;
    -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;
    display: -ms-flexbox; display: -webkit-flex; display: flex;
    -webkit-flex-direction: column; -ms-flex-direction: column; flex-direction: column;
    -webkit-flex-wrap: nowrap; -ms-flex-wrap: nowrap; flex-wrap: nowrap;
    -webkit-justify-content: flex-start; -ms-flex-pack: start; justify-content: flex-start;
    -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;       
	  }
      #itemBox0101{order: 0;}
      #itemBox0102{order: 1;}
      #itemBox0103{ order: 2;}
      #itemBox0104{ order: 3;}
      #itemBox0105{ order: 4;}
      #itemBox0106{ order: 5;}
      #itemBox0107{ order: 6;}
      #itemBox0108{ order: 7;}
      #itemBox0109{ order: 8;}
      #itemBox0110{ order: 9;}
            
      #itemBox0111{ order: 10;}
      #itemBox0112{ order: 11;}
      #itemBox0113{ order: 12;}
      #itemBox0114{ order: 13;}
      #itemBox0115{ order: 14;}
      #itemBox0116{ order: 15;}
      #itemBox0117{ order: 16;}
      #itemBox0118{ order: 17;}
      #itemBox0119{ order: 18;}
      #itemBox0120{ order: 19;}
            
      #itemBox0121{ order: 20;}
      #itemBox0122{ order: 21;}
      #itemBox0123{ order: 22;}
      #itemBox0124{ order: 23;}
      #itemBox0125{ order: 24;}
      #itemBox0126{ order: 25;}
      #itemBox0127{ order: 26;}
      #itemBox0128{ order: 27;}
      #itemBox0129{ order: 28;}
      #itemBox0130{ order: 29;}
      
      #itemBox0131{ order: 30;}
      #itemBox0132{ order: 31;}
      #itemBox0133{ order: 32;}
      #itemBox0134{ order: 33;}
      #itemBox0135{ order: 34;}
      #itemBox0136{ order: 35;}
      #itemBox0137{ order: 36;}
      #itemBox0138{ order: 37;}
      #itemBox0139{ order: 38;}
      #itemBox0140{ order: 39;}
            
      #itemBox0141{ order: 40;}
      #itemBox0142{ order: 41;}
      #itemBox0143{ order: 42;}
      #itemBox0144{ order: 43;}
      #itemBox0145{ order: 44;}
      #itemBox0146{ order: 45;}
      #itemBox0147{ order: 46;}
      #itemBox0148{ order: 47;}
      #itemBox0149{ order: 48;}
      #itemBox0150{ order: 49;}
      
      #itemBox0151{ order: 50;}
      #itemBox0152{ order: 51;}
      #itemBox0153{ order: 52;}
      #itemBox0154{ order: 53;}
      #itemBox0155{ order: 54;}
      #itemBox0156{ order: 55;}
      #itemBox0157{ order: 56;}
      #itemBox0158{ order: 57;}
      #itemBox0159{ order: 58;}
      #itemBox0160{ order: 59;}
      
      #itemBox0161{ order: 60;}
      #itemBox0162{ order: 61;}
      #itemBox0163{ order: 62;}
      #itemBox0164{ order: 63;}
      #itemBox0165{ order: 64;}
      #itemBox0166{ order: 65;}
      #itemBox0167{ order: 66;}
      #itemBox0168{ order: 67;}
      #itemBox0169{ order: 68;}
      #itemBox0170{ order: 69;}
      
      #itemBox0171{ order: 70;}
      #itemBox0172{ order: 71;}
      #itemBox0173{ order: 72;}
      #itemBox0174{ order: 73;}
      #itemBox0175{ order: 74;}
      #itemBox0176{ order: 75;}
      #itemBox0177{ order: 76;}
      #itemBox0178{ order: 77;}
      #itemBox0179{ order: 78;}
      #itemBox0180{ order: 79;}
      
      #itemBox0181{ order: 80;}
      #itemBox0182{ order: 81;}
      #itemBox0183{ order: 82;}
      #itemBox0184{ order: 83;}
      #itemBox0185{ order: 84;}
      #itemBox0186{ order: 85;}
      #itemBox0187{ order: 86;}
      #itemBox0188{ order: 87;}
      #itemBox0189{ order: 88;}
      #itemBox0190{ order: 89;}
      
      #itemBox0191{ order: 90;}
      #itemBox0192{ order: 91;}
      #itemBox0193{ order: 92;}
      #itemBox0194{ order: 93;}
      #itemBox0195{ order: 94;}
      #itemBox0196{ order: 95;}
      #itemBox0197{ order: 96;}
      #itemBox0198{ order: 97;}
      #itemBox0199{ order: 98;}
      #itemBox01100{ order: 99;}

      #itemBox01101{ order: 100;}
      #itemBox01102{ order: 101;}
      #itemBox01103{ order: 102;}
      #itemBox01104{ order: 103;}
      #itemBox01105{ order: 104;}
      #itemBox01106{ order: 105;}
      #itemBox01107{ order: 106;}
      #itemBox01108{ order: 107;}
      #itemBox01109{ order: 108;}
      #itemBox01110{ order: 109;}

      #itemBox01111{ order: 110;}
      #itemBox01112{ order: 111;}
      #itemBox01113{ order: 112;}
      #itemBox01114{ order: 113;}
      #itemBox01115{ order: 114;}
      #itemBox01116{ order: 115;}
      #itemBox01117{ order: 116;}
      #itemBox01118{ order: 117;}
      #itemBox01119{ order: 118;}
      #itemBox01120{ order: 119;}

      #itemBox01121{ order: 120;}
      #itemBox01122{ order: 121;}
      #itemBox01123{ order: 122;}
      #itemBox01124{ order: 123;}
      #itemBox01125{ order: 124;}
      #itemBox01126{ order: 125;}
      #itemBox01127{ order: 126;}
      #itemBox01128{ order: 127;}
      #itemBox01129{ order: 128;}
      #itemBox01130{ order: 129;}

      #itemBox01131{ order: 130;}
      #itemBox01132{ order: 131;}
      #itemBox01133{ order: 132;}
      #itemBox01134{ order: 133;}
      #itemBox01135{ order: 134;}
      #itemBox01136{ order: 135;}
      #itemBox01137{ order: 136;}
      #itemBox01138{ order: 137;}
      #itemBox01139{ order: 138;}
      #itemBox01140{ order: 139;}

      #itemBox01141{ order: 140;}
      #itemBox01142{ order: 141;}
      #itemBox01143{ order: 142;}
      #itemBox01144{ order: 143;}
      #itemBox01145{ order: 144;}
      #itemBox01146{ order: 145;}
      #itemBox01147{ order: 146;}
      #itemBox01148{ order: 147;}
      #itemBox01149{ order: 148;}

      .itemHead{/*border: 1px solid #fe3737;*/ width:100%;height:auto;
	  order: 0;flex: 0 0 auto; align-self: auto;
	  display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -webkit-flex-direction: row;
    -ms-flex-direction: row;
    flex-direction: row;
    -webkit-flex-wrap: nowrap;
    -ms-flex-wrap: nowrap;
    flex-wrap: nowrap;
    -webkit-justify-content: flex-start;
    -ms-flex-pack: start;
    justify-content: flex-start;
    -webkit-align-content: space-between;
    -ms-flex-line-pack: justify;
    align-content: space-between;
    -webkit-align-items: flex-start;
    -ms-flex-align: start;
    align-items: flex-start;
    }
      
    .itemTitle{/*border: 1px solid #fe3737;*/ position:relative;  width: auto/* calc(100% - 80px)*/; top:0px; margin:7px 0 0 15px;
     height:auto; color: #006d98;
     /*order: 0;flex: 0 0 auto; align-self: auto;*/
     -webkit-order: 0; -ms-flex-order: 0; order: 0;
    -webkit-flex: 1 0 auto; -ms-flex: 1 0 auto; flex: 1 0 auto;
    -webkit-align-self: auto; -ms-flex-item-align: auto; align-self: auto;
    }
    
    .rtun{ position: relative; width:36px;height:36px;  top:0px; font-size:12px; text-align:center;
     background-image:url('../../images/rturn.png'); background-size: contain;
     -webkit-order: 1; -ms-flex-order: 1; order: 1;
    -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;
     }
    .rtun2{ position: relative; width:36px;height:36px;  top:0px; font-size:12px; text-align:center;
     background-image: url('../../images/rturn2.png'); background-size: contain;
     -webkit-order: 1; -ms-flex-order: 1; order: 1;
    -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;
     }
    
  
    .itemMsg{/*border: 1px solid #ff0000;*/ width:calc(100% - 20px); height:auto; padding:10px;
	/*flex-item:05-3*/order: 2;flex: 0 0 auto; align-self: auto;
    }
    .exampletitle{border: 1px solid #a5b0ac; position:relative; top:-5px; left:5px; width:100px; height:22px; font-size:16px; padding-top:1.5px;
     text-align: center; background-color:#404945; color:#e3fff2;border-radius:13px;
    /*flex-item:05-4*//*order: 2;flex: 0 0 auto; align-self: auto;*/
    }
        
    .example{border: 1px solid #d1dbe2; width:calc(100% - 16px); height:auto; margin:15px 0 0 0; padding:7px; background-color:#f3f3f3;
    /*flex-item:05-5*/order: 3;flex: 0 0 auto; align-self: auto;
    }

 PRE{white-space:pre-wrap;}
 .smGly{ font-size:14px;font-weight:100;color:#8a8a8a;}
 .purple{ color:#8b00ff; font-style:italic;}
 .brown{color:#a91100;font-family: 'Source Code Pro', monospace;font-weight:400; font-style:italic; font-size:14px;}

@media screen and (max-width: 1600px){
 #topmsgbox{ width:calc(100% - 220px); margin:40px 0 0 180px;}
 #titleimgs{ top:40px;left:0px;}
}
@media screen and (max-width: 767px){
 #titleimgs{ top:70px;left:50%; margin-left:-87.5px;}
 #topmsgbox{ width:90%; margin:180px 0 0 0;}
}
@media screen and (max-width: 500px){
 .itemBox{  width:100%; margin:10px 0 10px 0; }
}

