﻿#item{
    margin-bottom: 150px;
}

#item h1{
    font-size: 200%;
    font-weight: bold;
    text-align: left!important;
    margin-top: 10px;
margin-bottom: 50px!important;
    line-height: 1.3
}
#item h1 span{
    display: block;
    font-size: 50%;
     padding-top: 5px;
     font-weight: normal;
    color: #999;
}
.h-outdoor{
	border-left: 8px solid #E6B644;
	padding: 5px 10px;
}
.h-indoor{
	border-left: 8px solid #5488c1;
	padding: 5px 10px;
}
#item h2{
    line-height: 1.4;
	font-size: 130%;
    font-weight: bold;
    margin-bottom: 15px!important;
	}
#item strong{
    display:inline-block;
    font-weight: bold;
    font-size: 120%;
   margin-bottom: 10px!important;
    line-height: 1.5;


}
#item h3{
    line-height: 1.4;
	font-size: 130%;
    font-weight: bold;
    margin-bottom: 15px!important;
	}
.gp{
    margin-top: 30px;
    width: 60px;
    
    
}

@media only screen and (max-width:768px){
    #item h1{
    font-size: 180%;
}
}
			/*
col2
----------------------------------------------------------------------------------------------------*/
#item .col2 {
    width : 90%;
	margin-right: auto;
	margin-left: auto;  
	text-align: left;
	line-height: 24px;
    font-size: 90%;
}
#item .col2 .item_img {
	float: left;
	width: 27%;
    margin-top: 15px;
	margin-left: 3%;
    margin-bottom: 100px;
	line-height: 28px;
     position: relative;
	text-align: center;	
	
		}
#item .col2 .item_text {
	float: left;
	width: 70%;
	margin-right: 0%;
	line-height: 28px;
    margin-top: 15px;
    background-color: #fff;
    box-sizing: border-box;
    padding: 30px;
	
		}




#item .col2 div img {	
	width: 100%;
	height:auto;

		}

#item .move iframe{
	position: absolute;
	top: 0;
	right: 0;
	width: 100%;
	height: 100%;
	
}
#item figure{
	width: 23%;
	margin-left: 1%;
	margin-right: 1%;
	float: left;
    margin-bottom: 15px;
	}
#item figure p{
	font-size: 80%;
    line-height: 16px;
	}

.collabo{
    width: 250px;
    margin-bottom:20px;
}

.collabo img{
    width: 100%;
}

@media only screen and (max-width:768px){
#item .col2 {
	width: 90%;
	text-align: left;
	line-height: 24px;
     clear: both;
    
}
#item .col2 .item_img {
	float: none;
	width: 100%;
    margin-bottom: 30px;
    margin-left: 0;
		}
#item .col2 .item_text {
    clear: both;
    float: none;
	width: 100%;
   padding-top: 50px;
    padding-left: 20px;
    padding-right: 20px;

		}

}
	
/*
table
----------------------------------------------------*/
#item table   {
	width: 100%;
	font-size: 90%;
	line-height: 1.6;
}
#item th, #item td  { 
    padding: 10px;
    border: 1px solid #ccc;
    border-left: none;
    border-right: none;

}
#item th  {
    padding-top: 20px;
    padding-bottom: 0px;
     }
     #item td  {
        padding-bottom: 20px;
    }

#item th  { width: 30%;
    text-align: left;
    font-weight: bold;
}
#item table  a {
color: #245fbb!important; 
}
@media only screen and (max-width:768px){
#item table { margin: 0 -10px; }
#item th, #item  td{
	width: 95%;
	display: block;
	border-top: none;
	padding-left: 5%;
    border-left: none;
    border-right: none;
    }
#item tr:first-child th   {
        border-top: 1px solid #ccc;
    }

#item th  {
    border-bottom: none ;
    }
    
}
.item_text ul {
  counter-reset:number; 
  list-style-type: none!important; 
  padding:0.5em;
}
.item_text ul li {
  position: relative;
  line-height: 1.8;
  padding: 0.5em 0.5em 0.5em 40px;
  margin-bottom: 10px;
}

.item_text ul li:before{
  position: absolute;
  counter-increment: number;
  content: counter(number);

  display:inline-block;
  background: #666;
  color: white;
  font-family: 'Avenir','Arial Black','Arial',sans-serif;
  font-weight:bold;
  font-size: 15px;
  border-radius: 50%;
  top:6px;
  left: 0;
  width: 25px;
  height: 25px;
  line-height:26px;
  text-align: center;
}

/*
物撮り画像
----------------------------------------------------*/

.sub-img li.current img {

  border: 3px solid #E6B644;

}


.main-img {
  width: 100%;
    margin-bottom: 15px;
}
.main-img img {
  height: auto;
  width: 100%;
}
.sub-img {
  display: flex;
    flex-wrap:wrap;
  margin-top: 10px;
}
.sub-img li {
  margin-right: 2%;
    margin-bottom: 7px;
  width: calc(94% / 4);
}
.sub-img li:nth-child(4n) {
  margin-right: 0;
}
.sub-img li img {
     box-sizing: border-box;
  border: 3px solid transparent;
 
}
.sub-img img {
  cursor: pointer;
  width: 100%;
}