﻿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;
}
 .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;
 }
   #titleimgs{/*border: 1px solid #b5cbaa;*/position: relative; width:117px;height:89px; background-size:contain; background-image:url('../images/TitleTop4.png');
              top:40px; margin-left:60px; z-index:6;	
   }
   h1{ position:absolute; /*border: 1px solid #b5cbaa;*/ text-align:center; font-size:17px; width:260px;left:50%; margin:15px 0 0 -130px; top:0; z-index:7;
   }
   h2{ position: absolute; /*border: 1px solid #b5cbaa;*/ text-align:center; font-size:14px; font-weight:normal; width:150px;left:50%; right:auto; margin:50px 0 0 -75px; top:0; z-index:8;
   }
 .mainphoto{ width:950px;/*49.48vw ;*/ height:760px;/*39.58vw ;*/ background-image: url('../images/06/0002L.jpg'); background-size:contain; background-repeat:no-repeat; margin-top:40px;
    border-radius: 3.16% / 3.95%;
    /*flex-item:01-2*/order: 1; flex: 0 0 auto; align-self: auto;
 }  
 .topmsgbox{border: 1px solid #e9e9e9; width:70%;height:auto;border-radius:10px; margin:50px 0 0 0; padding:10px; background-color:#fff7e7;
	/*flex-item:01-3*/order: 2; 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;
   }
   #ads01{
	/*flex-item:01-4*/order: 3;
   }
      .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-02*/   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: center; -ms-flex-pack: center; justify-content: center;
    -webkit-align-content: stretch; -ms-flex-line-pack: stretch; align-content: stretch;
    -webkit-align-items: center; -ms-flex-align: center; align-items: center;
 }
   #conentstitle01{ /*flex-item:01-5*/order: 4;}
   #conentstitle02{ /*flex-item:01-8*/order: 7;}
   #conentstitle03{ /*flex-item:01-10*/order: 9;}
      .line{ height:5px;/*border: 1px solid #ff8533;*/border-radius:2.5px; margin:0 5% 0 5%; background-color:#ffe4b3;
      }
      .line01{/*flex-item:02-01*/
              -webkit-order: 0; -ms-flex-order: 0; order: 0; -webkit-flex: 2 2 auto; -ms-flex: 2 2 auto; flex: 2 2 auto;}
      .titlemsg{/*border: 1px solid #ff8533;*/ width: auto; text-align:center;padding:3px 0 0 0; border-radius:12px; background-color:#ffc967; color:#ffffff;
                font-weight: 500; text-shadow: 1px 1px 1px rgba(0, 0, 0, 1);
              /*flex-item:02-02*/
   	          -webkit-order: 1; -ms-flex-order: 1; order: 1; -webkit-flex: 1 1 auto; -ms-flex: 1 1 auto; flex: 1 1 auto;}      
   	  .line02{/*flex-item:02-03*/
   	          -webkit-order: 2; -ms-flex-order: 2; order: 2; -webkit-flex: 2 2 auto; -ms-flex: 2 2 auto; flex: 2 2 auto;}
   	  
 .cotentsbox{ /*border: 1px solid #e9e9e9*/;width:90%; height:auto; min-height:300px; margin:30px 0 0 0;
	/*flex-item:01-x*/flex: 0 0 auto; align-self: auto;
	/*flex-cont-03*/
	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;

 }
   .citem{border: 1px solid #e9e9e9; width:470px;height: auto; min-height: 400px; margin:1%;
    /*flex-item:03-x*/
    -webkit-flex: 0 0 auto; -ms-flex: 0 0 auto; flex: 0 0 auto;
    -webkit-align-self: flex-start; -ms-flex-item-align: start; align-self: flex-start;
    /*flex-cont-04*/
    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;
    }
       .itemnumber{position:relative;border: 1px solid #e9e9e9; font-size:16px; width:30px;height:26px;top:0;left:0; text-align:center;border-radius: 50%; padding-top:3px;
               background-color:#a0b192;color:#ffffff;float:left;
    /*flex-item:05*/
    -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: flex-start; -ms-flex-item-align: start; align-self: flex-start;   
    }
       .itemmsg{ margin:5px 0 0 5px;
    /*flex-item:05*/
	-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: flex-start; -ms-flex-item-align: start; align-self: flex-start;
    }                     
    
    .itemchildeA{border: 1px solid #e9e9e9; background-color:#ffe3b4; width:96%;height:auto; margin: 5px 0 5px 5px;border-radius: 0px 15px 15px 0px;
    /*flex-item:04*/
    -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: flex-start; -ms-flex-item-align: start; align-self: flex-start;
    /*flex-cont-05*/
    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: flex-start; -ms-flex-line-pack: start; align-content: flex-start;
    -webkit-align-items: flex-start; -ms-flex-align: start; align-items: flex-start;
}
       .itemchildeB{/*border: 1px solid #e9e9e9;*/ width:96%;height:auto; min-height:230px; margin: 5px 2% 0 2%;
    /*flex-item:04*/
    -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: flex-start; -ms-flex-item-align: start; align-self: flex-start;
}
       .itemchildeC{/*border: 1px solid #b5cbaa;*/ width:96%;height:auto; margin:2%;
    /*flex-item:04*/
    -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: flex-start; -ms-flex-item-align: start; align-self: flex-start;
    /*flex-cont-06*/
    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: space-around; -ms-flex-pack: distribute; justify-content: space-around;
    -webkit-align-content: center; -ms-flex-line-pack: center; align-content: center;
    -webkit-align-items: center; -ms-flex-align: center; align-items: center;
}
     .imagesub{ border: 1px solid #e9e9e9;background-repeat:no-repeat;background-size:contain; width:100px;height:100px; }
     .popimg{ border: 1px solid #0009ff;}        
     .popimg:hover,.popimg:focus, .popimg:active{ cursor: pointer ;border-radius: 6px;
      -moz-box-shadow: 3px 3px 6px -1px rgba(0, 0, 0, 1);-webkit-box-shadow: 3px 3px 6px -1px rgba(0, 0, 0, 1);
      -ms-box-shadow: 3px 3px 6px -1px rgba(0, 0, 0, 1);box-shadow: 3px 3px 6px -1px rgba(0, 0, 0, 1);
      /*box-shadow: 3px 3px 6px -1px rgba(0, 0, 0, 1);      9px 9px 6px -7px rgba(0, 0, 0, 0.8)*/
      transform: translateY(-5px) translateX(2px);
      }
      
       #item01-01{	-webkit-order: 0; -ms-flex-order: 0; order: 0;}
       #item01-02{	-webkit-order: 1; -ms-flex-order: 1; order: 1;}
/*       
       #item01-03{	-webkit-order: 2; -ms-flex-order: 2; order: 2;}
       #item01-04{	-webkit-order: 3; -ms-flex-order: 3; order: 3;}
       #item01-05{	-webkit-order: 4; -ms-flex-order: 4; order: 4;}
*/      
       #img010101{ background-image:;}
       #img010102{ background-image:;}
       #img010103{ background-image:;}
       #img010104{ background-image:;}

       #img010201{ background-image:;}
       #img010202{ background-image:;}
       #img010203{ background-image:;}
       #img010204{ background-image:;}
/*       
       #img010301{ background-image:;}
       #img010302{ background-image:;}
       #img010303{ background-image:;}
       #img010304{ background-image:;}
       
       #img020101{ background-image:;}
       #img020102{ background-image:;}
       #img020103{ background-image:;}
       #img020104{ background-image:;}
              
       #img020201{ background-image:;}
       #img020202{ background-image:;}
       #img020203{ background-image:;}
       #img020204{ background-image:;}
       
       #img020301{ background-image:;}
       #img020302{ background-image:;}
       #img020303{ background-image:;}
       #img020304{ background-image:;}
*/       
       #img030101{ background-image:;}
       #img030102{ background-image:;}
       #img030103{ background-image:;}
       #img030104{ background-image:;}

   #cotentsbox01{/*flex-item:01-6*/order: 5;}
   #ads02{/*flex-item:01-7*/order: 6;}
   #cotentsbox02{/*flex-item:01-9*/order: 8;}
   #cotentsbox03{/*flex-item:01-11*/order: 10;}

 #footer{ width:100%; height: 50px; left:0px; z-index: 5; bottom:0px; background-color:#cf6f00;/*#999999;*/ color:#ffffff; text-shadow: 1px 1px 1px rgba(138, 138, 138, 1);
  border-radius:467px 467px 0px 0px / 50px 50px 0px 0px;/*←→↑↓半径の値を、左上・右上・右下・左下*/ 
}
  #footertitle{ position:relative; width: 160px; height: 25px; z-index: 1; top: 8px; left:50%; margin-left:-80px;padding:0 0 7px 0; text-align: center;}
  #footertitle a{ font-size: 1.25em; text-decoration:none; color:#ffffff;}
  #footertitle:hover{cursor:pointer;border-radius:3px 3px 3px 3px / 3px 3px 3px 3px;box-shadow:-1px -1px 1px #f2f2f2, 1px 1px 1px #4e4e4e;}

@media screen and (max-width: 1000px){
   /*h1{ margin:30px 0 0 -130px;}*/
   /*h2{ margin:60px 0 0 -75px;}*/
   .mainphoto{ width:95vw ;height:76vw ;}
   .topmsgbox{ width:90%;}
}
@media screen and (max-width: 640px){
   /*h1{ margin:7px 0 0 -130px;}*/
   /*h2{ margin:40px 0 0 -125px;}*/
   #titleimgs{ top:70px; margin-left:4.7vw;}
}
@media screen and (max-width: 500px){
   .citem{width:98%;}
}
@media screen and (max-width: 360px){
   #titleimgs{width:32.5vw;height:24.72vw; }
}


