@charset "UTF-8";

/* スタイルシート
　 作成者：Hirama Inc.
　 作成日：R3.09.01
-------------------------------------------------------------------------------------*/

.home {}

/*************************************************************************************
**************************************************************************************

  mainvisual

**************************************************************************************
**************************************************************************************/

.home #mainvisual {
background-image: url( ../images/mainvisual-bg.jpg);
background-size: cover;
background-repeat: no-repeat;
background-position: right 0 top 0;

display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex;
-webkit-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; 
-webkit-box-orient: horizontal;	-webkit-box-direction: normal;	-webkit-flex-direction: row;	-ms-flex-direction: row;	flex-direction: row;
-webkit-box-align: center;	-webkit-align-items: center;	-ms-flex-align: center;	align-items: center;
}


@media only screen  and (min-width: 1151px){
.home #mainvisual {
margin-top: 100px;
padding: 30px 0 50px;
}
}

@media only screen  and (min-width: 401px) and (max-width: 1150px){
.home #mainvisual {
margin-top: 80px;
padding: 20px 0 35px;
}
}

@media only screen  and (max-width: 400px){
.home #mainvisual {
margin-top: 80px;
padding: 10px 0 30px;
}
}

.home #mainvisual ul {
width: 100%;
margin: 0 auto;
}

@media only screen  and (min-width: 1151px){
.home #mainvisual ul {
max-width: 1100px;
}
}

@media only screen and (min-width: 451px) and (max-width: 1150px){
.home #mainvisual ul {
padding: 0 3%;
}
}

@media only screen  and (min-width: 451px){
.home #mainvisual ul {
display: grid; 

grid-auto-flow: column; 
grid-template-columns: 67% 1fr;
grid-template-rows: 50% 50%;
gap: 10px 10px; 
grid-template-areas: 
"left-photo right-photo1"
"left-photo right-photo2"; 
}
}

.left-photo {}
@media only screen  and (min-width: 451px){
.left-photo { 
grid-area: left-photo;
grid-column: 1 / 2;
grid-row: 1 / 3;
}
}

@media only screen  and (max-width: 450px){
.left-photo {}
}

.right-photo1 {}
@media only screen  and (min-width: 451px){
.right-photo1 {
grid-area: right-photo1;
grid-column: 2 / 3;
grid-row: 1 / 2;
}
}

@media only screen  and (max-width: 450px){
.right-photo1 {}
}

.right-photo2 {}
@media only screen  and (min-width: 451px){
.right-photo2 { 
grid-area: right-photo2;
grid-column: 2 / 3; 
grid-row: 2 / 3;
}
}

@media only screen  and (max-width: 450px){
.right-photo2  {}
}

/*IE11対策*/
@media all and (-ms-high-contrast:none) {
.home #mainvisual ul {
  display: -ms-grid;
  -ms-grid-columns: 1.4fr 0.7fr;
  -ms-grid-rows: 1fr 1fr;
  gap: 10px 10px;
}

.left-photo {
 -ms-grid-row: 1;
 -ms-grid-row-span: 2;
 -ms-grid-column: 1;
 -ms-grid-column-span: 1;
}

.left-photo img {
padding-right: 5px;
}

.right-photo1 {
 -ms-grid-row: 1;
 -ms-grid-row-span: 1;
 -ms-grid-column: 2;
 -ms-grid-column-span: 2;
}

.right-photo1 img {
padding-bottom: 2.5px;
padding-left: 5px;
}

.right-photo2 {
  -ms-grid-row: 2;
  -ms-grid-row-span: 1;
  -ms-grid-column: 2;
  -ms-grid-column-span: 1;
}
}

.right-photo2 img {
padding-top: 2.5px;
padding-left: 5px;
}

.right-photo2 img {
/*
padding-top: 2.5px;
padding-left: 5px;
*/
}

/*スマホ時のクロスフェードスライダー*/
@media only screen  and (max-width: 450px){
.home #mainvisual ul {
display: block;/*ここでないとIE11で高さが取得できない*/
position:relative;
padding: 0 3%;
width: 100%;
height: 100%;
}

.home #mainvisual ul::before {
 content: "";
 display: block;
 padding-top: 63%; /*背景画像の比率*/
}
}

.home #mainvisual ul > li {}

@media only screen  and (min-width: 451px){
.home #mainvisual ul > li {}
}


@media only screen  and (max-width: 450px){
.home #mainvisual ul > li {
  width:94%;height:100%;
  position:absolute;
  top:0;left:3%;
  animation-iteration-count:infinite;
  animation-duration:21s;
  /*z-index: 1000;*/
}

/* アニメーション開始時間の設定 */
.home #mainvisual ul > li:nth-of-type(1){
  animation-name:slide;
  animation-delay:-1s;
}

.home #mainvisual ul > li:nth-of-type(2){
  animation-name:slide;
  animation-delay:4s;
  opacity:0;
}

.home #mainvisual ul > li:nth-of-type(3){
  animation-name:slide;
  animation-delay:10s;
  opacity:0;
}
}

.home #mainvisual ul > li a:hover img{
opacity:1;
filter:alpha( opacity=100);
-ms-filter: "alpha( opacity=100 )";
}

/* フェードイン・フェードアウトの設定 */
@-webkit-keyframes slide{
  0%{
    opacity:0;
  }
  4.76%{
    opacity:1;
    z-index: 99;
  }
  33.33%{
    opacity:1;
    z-index: 99;
  }
  42.85%{
    opacity:0;
  }
  100%{
    opacity:0;
  } 
}

@keyframes slide{
  0%{
    opacity:0;
  }
  4.76%{
    opacity:1;
    z-index: 99;
  }
  33.33%{
    opacity:1;
    z-index: 99;
  }
  42.85%{
    opacity:0;
  }
  100%{
    opacity:0;
  } 
}


/*************************************************************************************
**************************************************************************************

  searchblock

**************************************************************************************
**************************************************************************************/

.home .searchblock {
background-color: #1C4898;
color: #FFF;
position: relative;
}

@media only screen  and (min-width: 1151px){
.home .searchblock {
padding: 40px 0 35px;
}
}

@media only screen and (min-width: 769px) and (max-width: 1150px){
.home .searchblock {
padding: 35px 0 25px;
}
}

@media only screen and (min-width: 641px) and (max-width: 768px){
.home .searchblock {
padding: 25px 0 23px;
}
}

@media only screen and (max-width: 640px){
.home .searchblock {
padding: 25px 0 20px;
}
}

.home .searchblock .inner {
width: 100%;
margin: 0 auto;
}

@media only screen  and (min-width: 1151px){
.home .searchblock .inner {
max-width: 1100px;
}
}

@media only screen and (max-width: 1150px){
.home .searchblock .inner {
padding: 0 3%;
}
}

.home .searchblock .item {}

@media only screen  and (min-width: 769px){
.home .searchblock .item {
margin-bottom: 25px;
}
}

@media only screen  and (max-width: 768px){
.home .searchblock .item {
margin-bottom: 20px;
}
}

.home .searchblock h2 {
position: absolute;
left: 50%;
transform: translateX(-50%);
background-color: #1C4898;
color: #FFF;
width: auto;
display: inline-block;
-webkit-border-top-left-radius: 7px;border-top-left-radius: 7px;
-webkit-border-top-right-radius: 7px;border-top-right-radius: 7px;
letter-spacing: 0.05em;
font-weight: bold; font-weight: 700;
}

@media only screen  and (min-width: 1151px){
.home .searchblock h2 {
top: -30px;
padding: 6px 25px;
font-size: 20px; font-size: 2.0rem;
}
}

@media only screen and (min-width: 769px) and (max-width: 1150px){
.home .searchblock h2 {
top: -20px;
padding: 5px 23px;
font-size: 17px; font-size: 1.7rem;
}
}

@media only screen and (min-width: 641px) and (max-width: 768px){
.home .searchblock h2 {
top: -20px;
padding: 5px 23px;
font-size: 16px; font-size: 1.6rem;
}
}

@media only screen and (max-width: 640px){
.home .searchblock h2 {
top: -20px;
padding: 5px 17px;
font-size: 14px; font-size: 1.4rem;
}
}

.home .searchblock h3 {
font-weight: bold; font-weight: 700;
border-bottom: #FFF solid 2px;
}

@media only screen  and (min-width: 1151px){
.home .searchblock h3 {
font-size: 20px; font-size: 2.0rem;
padding-bottom: 5px; margin-bottom: 3px;
}
}

@media only screen and (min-width: 769px) and (max-width: 1150px){
.home .searchblock h3 {
font-size: 18px; font-size: 1.8rem;
padding-bottom: 5px; margin-bottom: 3px;
}
}

@media only screen and (min-width: 641px) and (max-width: 768px){
.home .searchblock h3 {
font-size: 16px; font-size: 1.6rem;
padding-bottom: 5px; margin-bottom: 3px;
}
}

@media only screen and (max-width: 640px){
.home .searchblock h3 {
font-size: 14px; font-size: 1.4rem;
padding-bottom: 5px; margin-bottom: 3px;
}
}

.home .searchblock h3::before {
 content:"\f002";
 font-family: "FontAwesome";
 line-height: 1;
 margin-right: 5px;
 text-transform: none;
}

.home .searchblock ul {
display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex;
-webkit-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; 
-webkit-box-pack: start;	-webkit-justify-content: flex-start;	-ms-flex-pack: start;	justify-content: flex-start;
}

.home .searchblock ul > li {
line-height: 1.0;
margin-top: 10px;
}

@media only screen and (max-width: 640px){
.home .searchblock ul > li {
width: 33%;
}
}

.home .searchblock ul > li a {
color: #FFF;
}

.home .searchblock ul > li a:hover {
text-decoration: underline;

}

.home .searchblock li + li {}

@media only screen and (min-width: 641px){
.home .searchblock li + li {
border-left: solid 1px #FFF;
padding: 0 10px 0 10px;
word-break: break-all;
}
}

@media only screen and (max-width: 640px){
.home .searchblock li + li {
}
}

.home .searchblock ul > li:first-child {}

@media only screen and (min-width: 641px){
.home .searchblock ul > li:first-child {
padding: 0 10px 0 0;
}
}

@media only screen and (max-width: 640px){
.home .searchblock ul > li:first-child {}
}


/*************************************************************************************
**************************************************************************************

  main

**************************************************************************************
**************************************************************************************/

.home #main {}

.home #main .block {}

.home #main .inner {
width: 100%;
margin: 0 auto;
}

@media only screen  and (min-width: 1151px){
.home #main .inner {
max-width: 1100px;
}
}

@media only screen and (max-width: 1150px){
.home #main .inner {
padding: 0 3%;
}
}

/*blockttl*/
.home #main .blockttl {
width: 100%;
color:#1C4898;
font-weight: bold; font-weight: 700;
text-align: center;
line-height: 1.0;
letter-spacing: 0.05em;
}

@media only screen  and (min-width: 769px){
.home #main .blockttl {
font-size: 23px; font-size: 2.3rem;
}
}

@media only screen  and (min-width: 641px) and (max-width: 768px){
.home #main .blockttl {
font-size: 20px; font-size: 2.0rem;
}
}

@media only screen  and (max-width: 640px){
.home #main .blockttl {
font-size: 18px; font-size: 1.8rem;
}
}

.home #main .blockttl span {
display: block;
color: #777;
font-weight: normal;
letter-spacing: 0.01em;
}

@media only screen  and (min-width: 1151px){
.home #main .blockttl span {
font-size: 16px; font-size: 1.6rem;
margin-top: 10px;
}
}

@media only screen  and (min-width: 769px) and (max-width: 1150px){
.home #main .blockttl span {
font-size: 14px; font-size: 1.4rem;
margin-top: 10px;
}
}

@media only screen  and (min-width: 641px) and (max-width: 768px){
.home #main .blockttl span {
font-size: 13px; font-size: 1.3rem;
margin-top: 7px;
}
}

@media only screen  and (max-width: 640px){
.home #main .blockttl span {
font-size: 12px; font-size: 1.2rem;
margin-top: 7px;
}
}

/*btn*/
.home #main .btn {}

.home #main .btn a {
width: 100%;
display: block;
background-color:#2671BC;
border:#2671BC 2px solid;
color: #FFF;
font-weight: bold; font-weight: 700;
text-align: center;
-webkit-border-radius: 50px;
border-radius: 50px;
box-shadow: 0px 2px 2px rgba(0, 0, 0, 0.29);
}

@media only screen  and (min-width: 1151px){
.home #main .btn a {
font-size: 18px; font-size: 1.8rem;
padding: 10px 0;
}
}

@media only screen  and (min-width: 769px) and (max-width: 1150px){
.home #main .btn a {
font-size: 16px; font-size: 1.6rem;
padding: 10px 0;
}
}

@media only screen  and (min-width: 641px) and (max-width: 768px){
.home #main .btn a {
font-size: 14px; font-size: 1.4rem;
padding: 8px 0;

}
}

@media only screen  and (max-width: 640px){
.home #main .btn a {
font-size: 13px; font-size: 1.3rem;
padding: 7px 0;
}
}

.home #main .btn a:hover {
background-color:#FFF;
border:#2671BC 2px solid;
color: #2671BC;
}

.home #main .btn a::after {
content:"\f138";
font-family: "FontAwesome";
line-height: 1;
margin-left: 5px;
text-transform: none;
}

/*************************************************

  section01

**************************************************/

.home #main .section01 {}

@media only screen and (min-width: 1151px){
.home #main .section01 {
	padding:45px 0 50px;
}
}

@media only screen and (min-width: 641px) and (max-width: 1150px){
.home #main .section01 {
	padding:40px 0 45px;
}
}

@media only screen and (max-width: 641px){
.home #main .section01 {
	padding:25px 0 35px;
}
}

.home #main .section01 .blockttl {}

@media only screen  and (min-width: 769px){
.home #main .section01 .blockttl {
margin-bottom: 35px;
}
}

@media only screen  and (min-width: 641px) and (max-width: 768px){
.home #main .section01 .blockttl {
margin-bottom: 30px;
}
}

@media only screen  and (max-width: 640px){
.home #main .section01 .blockttl {
margin-bottom: 25px;
}
}

@media only screen  and (max-width: 640px){
.home #main .section01 .blockttl {
margin-bottom: 25px;
}
}

/*btn*/
.home #main .btn {}

@media only screen  and (min-width: 1151px){
.home #main .btn {
margin-top: 40px;
}
}

@media only screen  and (min-width: 601px) and (max-width: 1150px){
.home #main .btn {
margin-top: 35px;
}
}

@media only screen  and (max-width: 600px){
.home #main .btn {
margin-top: 25px;
}
}

.home #main .section01 dl {}

@media only screen and (min-width: 601px){
.home #main .section01 dl {
	width:100%;
}
}

@media only screen and (max-width: 600px){
.home #main .section01 dl {}
}

.home #main .section01 dl > dt {}

@media only screen and (min-width: 1101px){
.home #main .section01 dl > dt {
	width:200px;
	padding:0 20px 10px 50px;
	float:left;
	clear:both;
}
}

@media only screen and (min-width: 601px) and (max-width: 1100px){
.home #main .section01 dl > dt {
	width:120px;
	padding:0 20px 10px 0;
	float:left;
	clear:both;
}
}

@media only screen and (max-width: 600px){
.home #main .section01 dl > dt {
	width:100%;
	padding:0 0 7px 0;
}
}

.home #main .section01 dl > dd {}

@media only screen and (min-width: 1101px){
.home #main .section01 dl > dd {
	padding:0 50px 20px 200px;
	border-bottom:#DDD solid 2px;
	margin-bottom:20px;
	float:none;
}
}

@media only screen and (min-width: 601px) and (max-width: 1100px){
.home #main .section01 dl > dd {
	padding:0 0 12px 130px;
	border-bottom:#DDD solid 1px;
	margin-bottom:12px;
	float:none;
}
}

@media only screen and (max-width: 600px){
.home #main .section01 dl > dd {
	width:100%;
	border-bottom:#DDD solid 1px;
	padding-bottom:10px; margin-bottom:10px;
}
}

.home #main .section01 dl > dd span.tag {
	width:80px;
	display:inline-block;
	text-align:center;
	padding:3px 0;
	color:#FFF;
	-webkit-border-radius:5px;
	border-radius:5px;
	font-size:11px; font-size:1.1rem;
	margin-right:10px;
}

.home #main .section01 dl > dd span.tag.news_cat {
	background-color:#496DAD;
}

.home #main .section01 dl > dd span.tag.tour_cat {
	background-color:#F15A24;
}

.home #main .section01 dl > dd:nth-last-of-type(1) {
	width:100%;
	border-bottom:none;
	padding-bottom:0; margin-bottom:0;
}


/*************************************************

  section02

**************************************************/

.home #main .section02 {
background-color: #F2F2F2;
}

@media only screen and (min-width: 1151px){
.home #main .section02 {
	padding:45px 0 50px;
}
}

@media only screen and (min-width: 641px) and (max-width: 1150px){
.home #main .section02 {
	padding:35px 0 40px;
}
}

@media only screen and (max-width: 641px){
.home #main .section02 {
	padding:30px 0 35px;
}
}

.home #main .section02 .blockttl {}

@media only screen  and (min-width: 769px){
.home #main .section02 .blockttl {
margin-bottom: 35px;
}
}

@media only screen  and (min-width: 641px) and (max-width: 768px){
.home #main .section02 .blockttl {
margin-bottom: 30px;
}
}

@media only screen  and (max-width: 640px){
.home #main .section02 .blockttl {
margin-bottom: 25px;
}
}

@media only screen  and (max-width: 640px){
.home #main .section02 .blockttl {
margin-bottom: 25px;
}
}

/*btn*/
.home #main .section02 .btn {}

@media only screen  and (min-width: 1151px){
.home #main .section02 .btn {
margin-top: 40px;
}
}

@media only screen  and (min-width: 601px) and (max-width: 1150px){
.home #main .section02 .btn {
margin-top: 35px;
}
}

@media only screen  and (max-width: 600px){
.home #main .section02 .btn {
margin-top: 25px;
}
}

/*item*/
.home #main .section02 .item {
background-color: #FFF;
box-shadow: 0px 0px 16px -6px rgba(0,0,0,0.6);
margin-bottom: 30px;
}

@media only screen  and (min-width: 901px){
.home #main .section02 .item {
display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex;
padding: 20px 20px;
}
}

@media only screen  and (min-width: 801px) and (max-width: 900px){
.home #main .section02 .item {
display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex;
padding: 20px 20px;
}
}

@media only screen  and (min-width: 641px) and (max-width: 800px){
.home #main .section02 .item {
padding: 20px 20px;
}
}

@media only screen  and (max-width: 640px){
.home #main .section02 .item {
padding: 20px 20px;
}
}

.home #main .section02 .item .photo {}

@media only screen  and (min-width: 901px){
.home #main .section02 .item .photo {
width: 420px;
padding-right: 24.9px;
}
}

@media only screen  and (min-width: 801px) and (max-width: 900px){
.home #main .section02 .item .photo {
width: 700px;
padding-right: 19.9px;
}
}

@media only screen and (max-width: 800px){
.home #main .section02 .item .photo {
width: 100%;
margin-bottom: 13px;
}
}

.home #main .section02 .item .text {}

@media only screen  and (min-width: 901px){
.home #main .section02 .item .text {
width: -webkit-calc(100% - 440px);
width: calc(100% - 440px);
}
}

@media only screen  and (min-width: 801px) and (max-width: 900px){
.home #main .section02 .item .text {
width: -webkit-calc(100% - 200px);
width: calc(100% - 200px);
}
}

@media only screen and (max-width: 800px){
.home #main .section02 .item .text {
width: 100%;
}
}

.home #main .section02 .item .text .itemttl {
color: #1C4898;
font-weight: bold; font-weight: 700;
border-bottom: 2px solid #1C4898;
line-height: 1.5;
}

@media only screen  and (min-width: 1151px){
.home #main .section02 .item .text .itemttl {
padding: 0 0 10px;
margin: 0 0 8px;
font-size: 18px; font-size: 1.8rem;
}
}

@media only screen  and (min-width: 1001px) and (max-width: 1150px){
.home #main .section02 .item .text .itemttl {
padding: 0 0 10px;
margin: 0 0 8px;
font-size: 17px; font-size: 1.7rem;
}
}

@media only screen  and (min-width: 769px) and (max-width: 1000px){
.home #main .section02 .item .text .itemttl {
padding: 0 0 10px;
margin: 0 0 8px;
font-size: 16px; font-size: 1.6rem;
}
}

@media only screen  and (min-width: 641px) and (max-width: 768px){
.home #main .section02 .item .text .itemttl {
padding: 0 0 10px;
margin: 0 0 8px;
font-size: 15px; font-size: 1.5rem;
}
}

@media only screen  and (max-width: 640px){
.home #main .section02 .item .text .itemttl {
padding: 0 0 10px;
margin: 0 0 8px;
font-size: 14px; font-size: 1.4rem;
}
}

.home #main .section02 .item .text p {}

@media only screen and (min-width: 1151px){
.home #main .section02 .item .text p {
}
}

@media only screen  and (min-width: 641px)  and (max-width: 1150px){
.home #main .section02 .item .text p {
font-size: 90%;
}
}

@media only screen  and (max-width: 640px){
.home #main .section02 .item .text p {
font-size: 90%;
}
}

.home #main .section02 .item .text dl {
	width:100%;
 margin-top: 12px;
}

.home #main .section02 .item .text dl > dt {
	width:80px;
	text-align:center;
	padding:3px 0;
	color:#FFF;
	-webkit-border-radius:5px;
	border-radius:5px;
	font-size:11px; font-size:1.1rem;
 float:left;
	clear:both;
}

@media only screen  and (max-width: 640px){
.home #main .section02 .item .text dl > dt {
margin-bottom: 3px;
}
}

.home #main .section02 .item .text dl > dt.date {
	background-color:#496DAD;
}

.home #main .section02 .item .text dl > dt.thema {
	background-color:#F15A24;
}

.home #main .section02 .item .text dl > dd {
	padding:0 0 0 90px;
	margin-bottom:10px;
	float:none;
 line-height: 1.4;
}

@media only screen and (min-width: 1151px){
.home #main .section02 .item .text dl > dd {}
}

@media only screen  and (min-width: 641px)  and (max-width: 1150px){
.home #main .section02 .item .text dl > dd {
font-size: 90%;
}
}

@media only screen  and (max-width: 640px){
.home #main .section02 .item .text dl > dd {
font-size: 90%;
}
}

.home #main .section02 .item .text dl > dd > ul {
display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex;
-webkit-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; 
}

.home #main .section02 .item .text dl > dd > ul > li {
}

.home #main .section02 .item .text dl > dd > ul > li a {
margin-bottom: 10px;
padding-right: 10px;
}

.home #main .section02 .item .text dl > dd > ul > li + li a {
padding: 0 8px 0 8px;
word-break: break-all;
position: relative;
}

.home #main .section02 .item .text dl > dd > ul > li + li a::after {
content: "";
width: 1px; height: 80%;
display: block;
background-color: #888;
position: absolute; left: 0; top: 50%;
transform: translateY(-50%);
}

.home #main .section02 .item .text .bottom {
width:100%;
margin-top: auto;
/*
display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex;
-webkit-box-pack: justify;	-webkit-justify-content: space-between;	-ms-flex-pack: justify;	justify-content: space-between;
-webkit-box-align: center;	-webkit-align-items: center;	-ms-flex-align: center;	align-items: center;
*/
}

.home #main .section02 .item .text .bottom .price {
color:#C20D23;
font-weight: bold; font-weight: 700;
}

@media only screen  and (min-width: 769px){
.home #main .section02 .item .text .bottom .price {
font-size: 18px;font-size:1.8rem;
}
}

@media only screen  and (min-width: 641px) and (max-width: 768px){
.home #main .section02 .item .text .bottom .price {
font-size: 17px;font-size:1.7rem;
}
}

@media only screen  and (max-width: 640px){
.home #main .section02 .item .text .bottom .price {
font-size: 16px;font-size:1.6rem;
}
}

.home #main .section02 .item .text .bottom .price span {
margin-right: 7px;
}

@media only screen  and (min-width: 769px){
.home #main .section02 .item .text .bottom .price span {
font-size: 14px;font-size:1.4rem;
}
}

@media only screen  and (min-width: 641px) and (max-width: 768px){
.home #main .section02 .item .text .bottom .price span {
font-size: 13px;font-size:1.3rem;
}
}

@media only screen  and (max-width: 640px){
.home #main .section02 .item .text .bottom .price span {
font-size: 12px;font-size:1.2rem;
}
}

.home #main .section02 .item .text .bottom .itembtn {}

@media only screen  and (min-width: 951px){
.home #main .section02 .item .text .bottom .itembtn {
width: 30%;
margin-left: auto;
margin-top: 10px;
}
}

@media only screen  and (min-width: 769px) and (max-width: 950px){
.home #main .section02 .item .text .bottom .itembtn {
width: 50%;
margin-left: auto;
margin-top: 10px;
}
}

@media only screen  and (max-width: 768px){
.home #main .section02 .item .text .bottom .itembtn {
width: 100%;
margin-top: 15px;
}
}

.home #main .section02 .item .text .bottom .itembtn a {
width: 100%;
display: block;
background-color:#2671BC;
border:#2671BC 2px solid;
color: #FFF;
font-weight: bold; font-weight: 700;
text-align: center;
-webkit-border-radius: 50px;
border-radius: 50px;
line-height: 1.5;
}

@media only screen  and (min-width: 769px){
.home #main .section02 .item .text .bottom .itembtn a {
font-size: 13px;font-size:1.3rem;
padding: 2px 25px;
}
}

@media only screen and (max-width: 768px){
.home #main .section02 .item .text .bottom .itembtn a {
font-size: 12px;font-size:1.2rem;
padding: 7px 25px;
}
}

.home #main .section02 .item .text .bottom .itembtn a:hover {
background-color:#FFF;
border:#2671BC 2px solid;
color: #2671BC;
}


/*************************************************

  section03

**************************************************/

.home #main .section03 {}

@media only screen and (min-width: 1151px){
.home #main .section03 {
	padding:45px 0 0;
}
}

@media only screen and (min-width: 641px) and (max-width: 1150px){
.home #main .section03 {
	padding:40px 0 0;
}
}

@media only screen and (max-width: 641px){
.home #main .section03 {
	padding:25px 0 0;
}
}

.home #main .section03 .blockttl {}

@media only screen  and (min-width: 769px){
.home #main .section03 .blockttl {
margin-bottom: 35px;
}
}

@media only screen  and (min-width: 641px) and (max-width: 768px){
.home #main .section03 .blockttl {
margin-bottom: 30px;
}
}

@media only screen  and (max-width: 640px){
.home #main .section03 .blockttl {
margin-bottom: 25px;
}
}

@media only screen  and (max-width: 640px){
.home #main .section03 .blockttl {
margin-bottom: 25px;
}
}

/*btn*/
.home #main .section03 .btn {}

@media only screen  and (min-width: 601px){
.home #main .section03 .btn {
margin-top: 20px;
}
}

@media only screen  and (max-width: 600px){
.home #main .section03 .btn {
margin-top: 15px;
}
}

.home #main .section03 .flex {}

@media only screen  and (min-width: 401px){
.home #main .section03 .flex {
display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex;
-webkit-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; 
}
}

@media only screen  and (max-width: 400px){
.home #main .section03 .flex {}
}

.home #main .section03 .flex .item { 
	position:relative;
}

@media only screen and (min-width: 769px){
.home #main .section03 .flex .item {
	width:-webkit-calc((100% - 40px) / 3);
	width:calc((100% - 40px) / 3);
	margin:0 19.9px 25px 0;
}

.home #main .section03 .flex .item:nth-of-type(3n) {
	margin-right:0;
}
}

@media only screen and (min-width: 641px) and (max-width: 768px){
.home #main .section03 .flex .item {
	width:-webkit-calc((100% - 20px) / 3);
	width:calc((100% - 20px) / 3);
	margin:0 9.9px 20px 0;
}

.home #main .section03 .flex .item:nth-of-type(3n) {
	margin-right:0;
}
}

@media only screen and (min-width: 401px) and (max-width: 640px){
.home #main .section03 .flex .item {
	width:49%;
	margin-bottom:22px;
}

.home #main .section03 .flex .item:nth-of-type(odd) {
	margin-right:1%;
}

.home #main .section03 .flex .item:nth-of-type(even) {
	margin-left:1%;
}
}

@media only screen and (max-width: 400px){
.home #main .section03 .flex .item {
	width:100%;
	margin-bottom:22px;
}
}

.home #main .section03 .flex .item .ribbonArea {
position: absolute;
left: -4px; top: -10px;
z-index: 100;
}

.home #main .section03 .flex .item .ribbon {
position:relative;
width: auto;
max-width: 200px;
padding: 3px 8px;
background-color: #1C4898;
color: #FFF;
box-shadow:inset 0 0 50px rgba(0,0,0, 0.1), 0 2px 3px rgba(0, 0, 0, 0.3);
}

@media only screen and (min-width: 401px){
.home #main .section03 .flex .item .ribbon {
font-size: 11px; font-size: 1.1rem;
}
}

@media only screen and (max-width: 400px){
.home #main .section03 .flex .item .ribbon {
font-size: 10px; font-size: 1.0rem;
}
}

.home #main .section03 .flex .item .ribbon:after{  
content:' ';  
position:absolute;  
left:0px;  
bottom:-4px;  
border-top:2px solid #666;  
border-right:2px solid #666;  
border-bottom:2px solid transparent;  
border-left:2px solid transparent; 
z-index: -1;
}  

.home #main .section03 .flex .item .photo {
	width:100%;
}

@media only screen  and (min-width: 769px){
.home #main .section03 .flex .item .photo {
	margin-bottom:10px;
}	
}

@media only screen  and (min-width: 641px) and (max-width: 768px){
.home #main .section03 .flex .item .photo {
	margin-bottom:7px;
}	
}
	
@media only screen and (max-width: 640px){
.home #main .section03 .flex .item .photo {
	margin-bottom:5px;
}	
}

/*画像をトリミング*/
.home #main .section03 .flex .item .photo {
 position: relative;
 overflow: hidden;
 padding-top: 71.4%;
}

.home #main .section03 .flex .item .photo img {
 position: absolute;top: 0; left: 0;
 width: 100%;
 height: auto;
 z-index: 10;
}

.home #main .section03 .flex .item .text {}

.home #main .section03 .flex .item .text .itemttl {}

@media only screen  and (min-width: 769px){
.home #main .section03 .flex .item .text .itemttl {
line-height: 1.6;
}
}

@media only screen and (max-width: 768px){
.home #main .section03 .flex .item .text .itemttl {
line-height: 1.5;
}
}

.home #main .section03 .flex .item .text time {
font-family: 'Tenali Ramakrishna', sans-serif;
line-height: 1;
display: block;
}

@media only screen  and (min-width: 769px){
.home #main .section03 .flex .item .text time {
font-size: 18px; font-size: 1.8rem;
margin: 12px 0 2px;
}
}

@media only screen and (max-width: 768px){
.home #main .section03 .flex .item .text time {
font-size: 16px; font-size: 1.6rem;
margin: 12px 0 2px;
}
}


/*************************************************

  section04

**************************************************/

.home #main .section04 {}

@media only screen and (min-width: 1151px){
.home #main .section04 {
	padding:45px 0 0;
}
}

@media only screen and (min-width: 641px) and (max-width: 1150px){
.home #main .section04 {
	padding:40px 0 0;
}
}

@media only screen and (max-width: 641px){
.home #main .section04 {
	padding:25px 0 0;
}
}

.home #main .section04 .blockttl {}

@media only screen  and (min-width: 769px){
.home #main .section04 .blockttl {
margin-bottom: 35px;
}
}

@media only screen  and (min-width: 641px) and (max-width: 768px){
.home #main .section04 .blockttl {
margin-bottom: 30px;
}
}

@media only screen  and (max-width: 640px){
.home #main .section04 .blockttl {
margin-bottom: 25px;
}
}

@media only screen  and (max-width: 640px){
.home #main .section04 .blockttl {
margin-bottom: 25px;
}
}

/*btn*/
.home #main .section04 .btn {}

@media only screen  and (min-width: 601px){
.home #main .section04 .btn {
margin-top: 20px;
}
}

@media only screen  and (max-width: 600px){
.home #main .section04 .btn {
margin-top: 15px;
}
}

.home #main .section04 .flex {}

@media only screen  and (min-width: 401px){
.home #main .section04 .flex {
display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex;
-webkit-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; 
}
}

@media only screen  and (max-width: 400px){
.home #main .section04 .flex {}
}

.home #main .section04 .flex .item { 
	position:relative;
}

@media only screen and (min-width: 769px){
.home #main .section04 .flex .item {
	width:-webkit-calc((100% - 40px) / 3);
	width:calc((100% - 40px) / 3);
	margin:0 19.9px 25px 0;
}

.home #main .section04 .flex .item:nth-of-type(3n) {
	margin-right:0;
}
}

@media only screen and (min-width: 641px) and (max-width: 768px){
.home #main .section04 .flex .item {
	width:-webkit-calc((100% - 20px) / 3);
	width:calc((100% - 20px) / 3);
	margin:0 9.9px 20px 0;
}

.home #main .section04 .flex .item:nth-of-type(3n) {
	margin-right:0;
}
}

@media only screen and (min-width: 401px) and (max-width: 640px){
.home #main .section04 .flex .item {
	width:49%;
	margin-bottom:22px;
}

.home #main .section04 .flex .item:nth-of-type(odd) {
	margin-right:1%;
}

.home #main .section04 .flex .item:nth-of-type(even) {
	margin-left:1%;
}
}

@media only screen and (max-width: 400px){
.home #main .section04 .flex .item {
	width:100%;
	margin-bottom:22px;
}
}

.home #main .section04 .flex .item .ribbonArea {
position: absolute;
left: -4px; top: -10px;
z-index: 100;
}

.home #main .section04 .flex .item .ribbon {
position:relative;
width: auto;
max-width: 200px;
padding: 3px 8px;
background-color: #1C4898;
color: #FFF;
box-shadow:inset 0 0 50px rgba(0,0,0, 0.1), 0 2px 3px rgba(0, 0, 0, 0.3);
}

@media only screen and (min-width: 401px){
.home #main .section04 .flex .item .ribbon {
font-size: 11px; font-size: 1.1rem;
}
}

@media only screen and (max-width: 400px){
.home #main .section04 .flex .item .ribbon {
font-size: 10px; font-size: 1.0rem;
}
}

.home #main .section04 .flex .item .ribbon:after{  
content:' ';  
position:absolute;  
left:0px;  
bottom:-4px;  
border-top:2px solid #666;  
border-right:2px solid #666;  
border-bottom:2px solid transparent;  
border-left:2px solid transparent; 
z-index: -1;
}  

.home #main .section04 .flex .item .photo {
	width:100%;
}

@media only screen  and (min-width: 769px){
.home #main .section04 .flex .item .photo {
	margin-bottom:10px;
}	
}

@media only screen  and (min-width: 641px) and (max-width: 768px){
.home #main .section04 .flex .item .photo {
	margin-bottom:7px;
}	
}
	
@media only screen and (max-width: 640px){
.home #main .section04 .flex .item .photo {
	margin-bottom:5px;
}	
}

/*画像をトリミング*/
.home #main .section04 .flex .item .photo {
 position: relative;
 overflow: hidden;
 padding-top: 71.4%;
}

.home #main .section04 .flex .item .photo img {
 position: absolute;top: 0; left: 0;
 width: 100%;
 height: auto;
 z-index: 10;
}

.home #main .section04 .flex .item .text {}

.home #main .section04 .flex .item .text .itemttl {}

@media only screen  and (min-width: 769px){
.home #main .section04 .flex .item .text .itemttl {
line-height: 1.6;
}
}

@media only screen and (max-width: 768px){
.home #main .section04 .flex .item .text .itemttl {
line-height: 1.5;
}
}

.home #main .section04 .flex .item .text time {
font-family: 'Tenali Ramakrishna', sans-serif;
line-height: 1;
display: block;
}

@media only screen  and (min-width: 769px){
.home #main .section04 .flex .item .text time {
font-size: 18px; font-size: 1.8rem;
margin: 12px 0 2px;
}
}

@media only screen and (max-width: 768px){
.home #main .section04 .flex .item .text time {
font-size: 16px; font-size: 1.6rem;
margin: 12px 0 2px;
}
}

/*************************************************

  20261005追加

**************************************************/

.home #main .special-bnr {
	margin: 10px 0 60px;
}

@media only screen and (max-width: 768px){
.home #main .special-bnr {
	margin: 10px 0 40px;
}
}