@charset "utf-8";
/* CSS Document */






@font-face{
font-family:'HuiFontP109';
src:url('https://dl.dropboxusercontent.com/s/6snqvg654tirsyv/HuiFontP109.eot');
src:url('https://dl.dropboxusercontent.com/s/6snqvg654tirsyv/HuiFontP109.eot?#iefix') format('embedded-opentype'),
url('https://dl.dropboxusercontent.com/s/7pscemjdvt0wyiq/HuiFontP109.woff') format('woff'),
url('https://dl.dropboxusercontent.com/s/0w9uuopxrns8ehi/HuiFontP109.ttf') format('truetype'),
url('https://dl.dropboxusercontent.com/s/xnnsbxtz8o6d98i/HuiFontP109.svg#HuiFontP109') format('svg');
} 
    
            
        
      div {
	margin: 0 auto;
}
img {
	margin: 0 auto;
	width: 100%;
	display: block;
}




a {
    text-decoration: none;
    color: #000;
    font-weight: 600;
}

p {
    font-size: 1.8rem;
    line-height: 1.875;
    letter-spacing: 1px;
} 
        
        
        
 @media screen and (min-width: 1px) and (max-width: 960px) {       
        
p {
    font-size: 1.6rem;
    line-height: 1.75;
    letter-spacing: 0.1px;
}      
        }

/*---ベース---*/

section {
	width: 100%;
	display:inline-block;
    position: relative;
}

  
        
        
        
        
        
        
        
        
        
        .container {
            width: 100%;
            background-color: #f1f1f1;
        }
        .pc-image {
            display: block;
    width: 100%;
    max-width: 1200px;
    margin: 0 auto;
}

    .text {
    text-align: justify;
        color:#001257;
}    
.text-innner {
    width: 600px;
    display: block;
    margin: 50px auto 150px;
}
        
        @media screen and (min-width: 1px) and (max-width: 960px)
        {
            .text-innner {
    width: 90%;
    display: block;
    margin: 50px auto ; 
        }      
        }
        
        
section#intro {
    background-color: #e5e7e7;
    margin-bottom: 400px;
    padding-top: 50px;
}  
        
     @media screen and (min-width: 1px) and (max-width: 960px) {
     
   section#intro {
    background-color: transparent;
    margin-bottom: 0;
}     
        }
 /*--クレジット---*/       
        
ul.credit {
    display: block;
    margin: 2rem 0;
    font-size: 1.2rem;
    line-height: 1.7;
    /* float: left; */
}        
p.midashi {
    font-size: 3.3rem;
    margin: 1rem 0;
    font-family: 'HuiFontP109';
    letter-spacing: 0.2em;
}     
.credit li {
    float: left;
    margin-right: 0.5rem;
}
        
        
        
    /*---個々のテキスト---*/  
        
#oneil {
    top: 100px;
    left: 220px;
}    
    
        
  /*---タイトル---*/         
.title {
    padding: 0;
    width: 420px;
    position: relative;
    margin: 100px auto;
}
.title h2 {
font-size: 1.8rem;
    line-height: 2;
    text-align: justify;
    padding: 1em 5px;
    border-top: 6px double #000;
    border-bottom: 6px double #000;
}
        .title p {
    line-height: 2.4;
 
}
  .banner {
    display: block;
    margin: 2rem 0;
}
    .banner p {
    line-height: 1.75;
    font-weight: bold;
    letter-spacing: 0.5px;
}

        
p.botton {
    display: block;
    border: 3px solid;
    margin: 1rem 0;
    line-height: 3;
    text-align: center;
    font-weight: normal;
}        
    

@media screen and (min-width: 1001px) and (max-width: 3000px) {
    
.title {
width: 420px;

        position: absolute;
    top: 500px;
    right: 200px;
}
        }
  @media screen and (min-width: 240px) and (max-width: 640px) {
    
.title {
width: 80%;
}  
    }
               
   /*---アイテムリスト---*/
    
        #loft-back{
            background:#ddd url(images/201029-po01.jpg) no-repeat center center;
background-size: auto 500px;
        }
    
    

  header {
    position: fixed;
    top: 0;
    z-index: 9999;
    width: 100%;
    height: 60px;
    margin: 0 auto;
    padding: 15px 3% 10px;
    background-color:#e5e7e7;
}
div.logo {
    width: 15%;
    max-width: 120px;
    line-height: 100px;
    margin-left: 5px;
    float: left;
}
div.menu {
	float: right;
}
ul.header_ul {
	margin: 0;
	padding: 0;
}
ul.header_ul li {
display: inline-block;
    margin: 0px 10px;
    font-size: 20px;
}
 
    
   /*---アイテムリスト---*/    
    
.item-list {
    width: 94%;
    max-width: 1000px;
    margin: 50px auto;
    border-bottom: solid 5px;
    padding-bottom: 10px;
    display: block;
}
p.list-title {
    text-align: center;
    font-size: 2rem;
    line-height: 1.6;
    border-top: solid 4px;
    border-bottom: solid 4px;
    margin-bottom: 10px;
    padding: 0 -5px 0 0;
    padding-right: -5px;
}        
    
    
.item-list ul {
    list-style: none;
    display: inline-block;
         display:-webkit-box;
    display:-moz-box;
    display:-ms-flexbox;
    display:-webkit-flex;
    display:-moz-flex;
    display:flex;
    -webkit-box-lines:multiple;
    -moz-box-lines:multiple;
    -webkit-flex-wrap:wrap;
    -moz-flex-wrap:wrap;
    -ms-flex-wrap:wrap;
    flex-wrap:wrap;
}

    
    
.item-list ul li {
    float: left;
    width: 25%;
margin : 0 -1px -1px 0;
border : solid 1px;
}


.item-list ul li h3 {
width: 94%;
    margin: 0 auto;
    font-size: 1.6rem;
    font-weight: bold;
    line-height: 1.8;
    text-align: center;
    border-bottom: solid 1px;
}

.item-list ul li h4 {
    width: 94%;
    margin: 0 auto;
    font-size: 1.1rem;
    line-height: 1.7;
    text-align: center;
    border-bottom: solid 1px;
}
.item-list ul li p {
    width: 90%;
    margin: 0 auto;
    padding: 10% 5%;
}

.item-list img {
    width: 100%;
}

@media screen and (min-width: 1px) and (max-width: 960px) {
    
    .item-list  {
    margin: 50px 3%;
    border-bottom: solid 5px;
    padding-bottom: 10px;
    display: inline-block;
}
}

@media screen and (min-width: 641px) and (max-width: 960px) {
    
    .item-list ul li {
    float: left;
    width: 33.333333333%;
margin : 0 -1px -1px 0;
border : solid 1px;
}

    
    
    }
        
    
@media screen and (min-width: 321px) and (max-width: 640px) {
    
    .item-list ul li {
    float: left;
    width: 50%;
margin : 0 -1px -1px 0;
border : solid 1px;
        padding: 0;
}

    
    
    }     
        
        
        
   /*---フッター---*/

.footer {
    width: 100%;
    background-color: #e5e7e7;
    font-size: 12px;
    text-align: center;
    margin: 0;
    padding: 50px 0;

}    
    
/*Topへボタン*/
#pageTop {
	position: fixed;
	bottom: 20px;
	right: 20px;
}
#pageTop a {
display: block;
    z-index: 999;
    border-radius: 30px;
    width: 40px;
    height: 40px;
    background-color: #9FD6D2;
    color: #fff;
    font-size: 20px;
    text-decoration: none;
    text-align: center;
    line-height: 1;
    padding: 10px 10px;
    letter-spacing: 2px;
}
#pageTop a:hover {
	text-decoration: none;
	opacity: 0.7;
}