@charset "UTF-8";

.histroy {
text-align:left;
	padding:10px;

}

/*----------------------------------------
header
----------------------------------------*/
section header {
height:auto;
}

#bg-header{
position:relative;
width: 100%;
padding-bottom:38.25%;
}

#bg-header .row{
z-index: 8;
position:relative;
}

header .videoBox {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 1;

}

header .videoBox video{
  width: 100%;
}

header .snsBox {
text-align:right;
padding:15px 0 80px 0;
position:relative;
z-index:9;
}

header .snsBox ul {
display:inline-block;
}

header .snsBox ul li:first-child {
margin-right:15px;
}

header .snsBox ul li {
float:left;
margin-left:10px;
}

#bg-header h1,
#bg-header p{
display:none;
}

header .snsBox img,
#bg-header p img{
	max-width:100%;
	height:auto;
}

.cap{
	letter-spacing:0.1em;
	font-weight:bold;
	color:#ffa500;
	font-size:large;
}

.cap2{
	margin:20px 0;
	letter-spacing:0.1em;
	font-weight:bold;
	color:#09185d;
	font-size:large;
	text-decoration:underline;
}

@media only screen and (max-width:768px){

#bg-header h1 img{
	max-width:80%;
	height:auto;
}

header .snsBox{
padding: 85px 0 20px 0;
}

#bg-header h1,
#bg-header p{
text-align:center;
line-height:0;
padding:0 0 80px 0;
display:block;
}

#bg-header h1{
    padding: 0 0 40px 0;
}

header .videoBox video{
	display:none;
}

#bg-header{
	background:url(../img/main.jpg) no-repeat center top;
	background-size:cover;
	padding:0;
}

}

@media only screen and (max-width:500px){
#bg-header{
	background-position:right;
}



}

@media only screen and (max-width:364px){

header .snsBox{
	text-align:center;
}

header .snsBox ul li:first-child {
    margin-right: 0;
}

header .snsBox img{
	max-width:90%;
}

header .snsBox ul li{
	margin:0;
}

}

/*----------------------------------------
sec02
----------------------------------------*/
#sec02 .contents {
background:url(../img/bg4.jpg) no-repeat center;
background-size:cover;
background-attachment:fixed;
text-align:center;
padding:80px 0 0 0;
}

#sec02 .contents .inner {
width:80%;
margin:0 auto;
}

#sec02 .contents h2 {
	font-size:20px;
	padding:10px;
margin:30px 0 10px 0;
background:#6f5bca;
border-bottom:solid 5px #09185d;
text-align: left;
color:#fff;
}

#sec02 .contents p {
color:#000;
text-align:left;
line-height:2em;
font-weight:normal;
letter-spacing:0.1em;
}

#sec02 .contents p.companyName {
text-align:right;
font-size:127%;
}

@media only screen and (max-width:500px){
#sec02 .contents .inner {
    width:90%;
    margin:0 auto;
}

}

/*----------------------------------------
action
----------------------------------------*/

#action{
	background:#fff;
	padding:80px 0;
}

#action .con-img{
	float:left;
	width:30%;
	text-align:center;
}

#action .con-desc{
	float:right;
	width:67%;
	color:#333;
}

#action h3{
	margin:0 0 15px 0;
}

#action h4{
	margin:0 0 15px 0;
	font-size:20px;
	font-weight:bold;
}

.swiper-container {
        width: 100%;
        min-height:100%;
        margin-left: auto;
        margin-right: auto;
}
.swiper-slide {
        /* Center slide text vertically */
        display: -webkit-box;
        display: -ms-flexbox;
        display: -webkit-flex;
        display: flex;
        -webkit-box-pack: center;
        -ms-flex-pack: center;
        -webkit-justify-content: center;
        justify-content: center;
        -webkit-box-align: center;
        -ms-flex-align: center;
        -webkit-align-items: center;
        align-items: center;
}

.swiper-button-prev{
  background-image:url(/wp-content/themes/hitomitekko/img/arrow_l.png)!important;
  background-size:15px 23px!important;
}

.swiper-button-next{
  background-image:url(/wp-content/themes/hitomitekko/img/arrow_r.png)!important;
  background-size:15px 23px!important;
}


@media only screen and (max-width:768px){

#action .con-img,
#action .con-desc{
	float:none;
	width:auto;
	margin:0 0 20px 0;
}

#action h3{
	text-align:center;
}

}


/*----------------------------------------
sec03
----------------------------------------*/
#sec03 .column4 {
width:20%;
float:left;
text-align:center;
}

#sec03 .column4 .thumb img {
width:90%;
height:auto;
border:solid 3px #fff;
}

#sec03 .column4 h3 {
width:auto;
min-height:35px;
		padding:10px 0 0 0;
margin:10px;
background:#09185d;
-moz-border-radius: 5px;
-webkit-border-radius: 5px;
border-radius: 5px;
text-align: center;
color:#fff;
}

#sec03 .column4 .txt {
padding:20px 20px;
margin-left:20px;
float:none;
text-align:center;
}

#sec03 .contents .pict img {
width:100%;
height:auto;
}

#sec03 .column4 h3 img {
max-width:100%;
height:auto;
}

#sec03 .con-img{
	float:left;
	width:30%;
	text-align:center;
}

#sec03 .con-desc{
	float:right;
	width:67%;
	color:#333;
}

#sec03 h3{
	margin:0 0 15px 0;
}

#sec03 h4{
	margin:0 0 15px 0;
	font-size:20px;
	font-weight:bold;
}


@media only screen and (max-width:768px){
#sec03 .column4 {
    width:50%;
}

#sec03 .con-img,
#sec03 .con-desc{
	float:none;
	width:auto;
	margin:0 0 20px 0;
}

#sec03 h3{
	text-align:center;
}

}

@media only screen and (max-width:400px){
#sec03 .column4 {
    width:100%;
    float:none;
}
}


/*----------------------------------------
sec04
----------------------------------------*/
#sec04 .contents {
background:#898989;
background-size:cover;
padding:140px 2%;
text-align:center;
}

#sec04 .contents p {
line-height:2.5em;
margin-bottom:20px;
}

#sec04 .contents li {
margin-bottom:7px;
}

#sec04 .contents li em {
color:#ff4800;
}

@media only screen and (max-width:500px){
#sec04 .contents li em {
	display:block;
	margin:0 0 15px 0;
}

}



/*----------------------------------------
sec05
----------------------------------------*/
#sec05 .contents {
	width:100%;
	height:377px;
	background:url(../img/bg_hanamachi.jpg) no-repeat center right;
	background-size:cover;
}

#sec05 .contents span{
	display:none;
}

#sec05 .contents a{
	display:block;
	width:100%;
	height:100%;
}

#sec05 .contents img{
	width:100%;
	height:auto;
}

#sec05 .secInfo {
    background:#fff;
    padding:30px 0;
	margin:0;
}


@media only screen and (max-width:800px){
#sec05 .contents {
	background:url(../img/bg_hanamachi02.png) no-repeat center top;
	background-size:contain;
	height:auto;
	padding:48% 0 0 0;
}

}



/*----------------------------------------
sec06
----------------------------------------*/
#sec06 .contents {
	width:100%;
	height:559px;
	background:url(../img/bg_shiturae.jpg) no-repeat center;
	background-size:cover;
}


#sec06 .contents img{
	width:100%;
	height:auto;
}

@media only screen and (max-width:600px){
#sec06 .contents {
	background:url(../img/bg_shiturae02.png) no-repeat center top;
	background-size:contain;
	height:auto;
	padding:70% 0 0 0;
}

}


/*----------------------------------------
sec07
----------------------------------------*/
#sec07 .contents{
background:#fbecd1;
padding:55px 0 140px;
background-size:cover;
border-style:solid none;
border-width:5px;
border-color:#f1d5a1;
}

#sec07 dl {
width:80%;
}

#sec07 dt {
float: left;
clear: both;
width: 15%;
font-weight: bold;
text-align:left;
}

#sec07 dd {
float:right;
width:83%;
margin-bottom:10px;
line-height:1.7em;
    text-align:left;
}

@media only screen and (max-width:768px) {
    #sec07 .contents {
        padding: 30px 0 50px;
        background:url(../img/bg_company.jpg) no-repeat 90% left top;
    }

    #sec07 .contents .row {
        text-align: center;
    }
	#sec07 dl {
	width:100%;
	}
    #sec07 dt {
        width:25%;
    }

    #sec07 dd {
        width:73%;
    }
}

@media only screen and (max-width:500px){

#sec07 .contents .row dl {
    text-align:left;
    display:block;
}

#sec07 .contents .row dt,
#sec07 .contents .row dd  {
    display:block;
    float:none;
    text-align:left;
    width:100%;
	margin:0 0 10px 0;
}
#sec07 .contents .row dd {
	margin:0 0 30px 0;
}
}




/*----------------------------------------
hoshii 手に取ってほしい
----------------------------------------*/

.hoshibox {
width:25%;
float:left;
text-align:center;
border:solid 1px #ccc;
}



#hoshii .column4 {
width:25%;
float:left;
text-align:center;
background-color:#ccc;
}

#hoshii .column4 .thumb img {
width:100%;
height:auto;
}

#hoshii .column4 h3 {
width:auto;
min-height:35px;
}

#hoshii .column4 .txt {
padding:20px 5px;
float:none;
text-align:center;
}

#hoshii .pict img {
width:100%;
height:auto;
}

#hoshii .column4 h3 img {
max-width:100%;
height:auto;
}

#hoshii .con-img{
	float:left;
	width:30%;
	text-align:center;
}

#hoshii .con-desc{
	float:right;
	width:67%;
	color:#333;
}

#hoshii h3{
	margin:0 0 15px 0;
}

#hoshii h4{
	margin:0 0 15px 0;
	font-size:20px;
	font-weight:bold;
}


@media only screen and (max-width:768px){
#hoshii .column4 {
    width:50%;
}

#hoshii .con-img,
#hoshii .con-desc{
	float:none;
	width:auto;
	margin:0 0 20px 0;
}

#hoshii h3{
	text-align:center;
}

}

@media only screen and (max-width:400px){
#hoshii .column4 {
    width:100%;
    float:none;
}
}

/*----------------------------------------
GALLERY
----------------------------------------*/

.gallery-list{
	margin:0 0 100px 0;
}

.gallery-list li{
	float:left;
	width:25%;
}

.gallery-list li img{
	width:100%;
	height:auto;
}

@media only screen and (max-width:500px){

.gallery-list li{
	width:50%;
}

}