@charset "utf-8";
/*----------------------------------------------------------------------------------------------------------
	スマホ用（～768px）
------------------------------------------------------------------------------------------------------------*/
/*メインイメージ(sp)**********/
#mainImg01{
	margin-bottom: 2rem;
}
#mainImg02{
	position: relative;
	background: #ededed;
	width: 100%;
	padding-top:20%;
}
#mainImg02 .copy01{
	position: absolute;
	width: 60%;
	top: 8%;
	left: 4%;
}
#mainImg02 .copy02{
	position: absolute;
	width: 28%;
	top: 5%;
	right: 3%;
}
#mainImg02 .copy03{
	position: absolute;
	width: 28%;
	top: 47%;
	right: 3%;
}
#mainImg02 .copy_italy{
	position: absolute;
	width: 94%;
	top: 8%;
	left: 4%;
	font-family: 'Comfortaa', cursive;
	font-weight: 700;
	font-size: 1.25rem;
	line-height: 200%;
	text-shadow: 1px 1px 0px #fff;
	color: #4D4D4D;
}
#mainImg02 .copy_italy strong{
	color: #cb0100;
}
@media screen and (max-width:450px){
#mainImg02 .copy_italy{
	font-size: 1rem;
	line-height: 150%;
}
}
/*緊急(sp)**********/
#area_important{
	margin-bottom: 2.5rem;
	padding: 0.5rem 1rem;
	font-size: 1rem;
	position: relative;
    background: #FFE5E5;
    box-shadow: 0px 0px 0px 5px #FFE5E5;
    border: dashed 2px white;
    color: #454545;
}
#area_important:after{
	position: absolute;
    content: '';
    right: -7px;
    top: -7px;
    border-width: 0 15px 15px 0;
    border-style: solid;
    border-color: #FFB2B2 #fff #FFB2B2;
    box-shadow: -1px 1px 1px rgba(0, 0, 0, 0.15);
}
#area_important a{
	color: #1a1a1a;
}
#area_important a:hover{
	color: #1a1a1a;
	text-decoration: underline;
}
#area_important .head{
	margin: 0 0 0.5rem 0;
	font-weight: bold;
}

/*導入(sp)**********/
#area_intro{margin-bottom: 2.5rem;}
#area_intro .head{
	width: 100%;
	max-width: 455px;
	margin: 0 auto 0.75rem auto;
}
#area_intro .head_sub01{
	padding: 0;
	margin-bottom: 0.75rem;
	color: #cb0100;
	font-size: 1.06rem;
	font-weight: bold;
	text-align: center;
	text-shadow: 2px 2px 2px rgba(0,0,0,0.15);
}
/*#area_intro .head_sub01{
	background: #e5e5e5;
	border: double 3px #fff;
	text-align: center;
	padding: 0.25rem 2rem;
	margin-bottom: 1rem;
	color: #282414;
	text-shadow: 1px 1px 0px #fff;
}*/
#area_intro .head_sub02{display: none;}
#area_intro .head_sub_italy{
	margin-bottom: 0.5rem;
}
#area_intro .head_sub_italy .in{
	display: inline;
	font-family: 'Comfortaa', cursive;
	font-weight: 400;
	font-size: 1.25rem;
	text-shadow: 1px 1px 1px #fff;
	background: url(../image/common/bg_line03.png) repeat-x 0% 100%;
	background-size: 20px;
	padding: 0 2px 4px 2px;
}
#area_intro strong{color: #0079c2;}

ul.ul_intro01{margin-bottom: 1rem;}
ul.ul_intro01 li{
	border-top: 1px solid #322e1a;
	font-size: 0.88rem;
	padding: 1rem;
}
ul.ul_intro01 li img{
	display: block;
	width: 100%;
	max-width: 280px;
	margin: 0 auto 1rem auto;
}

/*特長(sp)**********/
#area_advantage{
	background: url(../image/common/bg_grid01.png) repeat 0 0;
	background-size: 48px;
	padding: 2rem 0;
	margin-bottom: 2.5rem;
}
#area_advantage .bex_right{
	text-align: center;
}
#area_advantage img.img_head{
	width: 100%;
	max-width: 535px;
	margin-bottom: 1rem;
}
#area_advantage img.img_picture{
	display: block;
	width: 100%;
	max-width: 373px;
	margin: 0 auto;
}
#area_advantage .head_italy{
	border-left: 4px solid #cb0100;
	font-family: 'Comfortaa', cursive;
	font-weight: 400;
	font-size: 1.25rem;
	padding: 0 0 0 10px;
	margin-bottom: 1rem;
}

/*お知らせ＆カレンダー見出し(sp)**********/
#area_info .head,
#area_calendar .head{
	text-align: center;
	font-size: 1.38rem;
	font-family: 'Comfortaa', cursive;
	font-weight: 400;
	border-bottom: 3px solid #cb0100;
	padding:5px 0;
	margin-bottom: 1rem;
}
#area_info .head:before{
	content: '';/*何も入れない*/
	display: inline-block;/*忘れずに！*/
	width: 27px;/*画像の幅*/
	height: 26px;/*画像の高さ*/
	vertical-align: middle;
	background: url(../image/common/icn_loudhailer01.png) no-repeat 0 0;
	background-size: contain;
	margin: 0 10px 3px 0;
}
#area_calendar .head:before{
	content: '';/*何も入れない*/
	display: inline-block;/*忘れずに！*/
	width: 28px;/*画像の幅*/
	height: 29px;/*画像の高さ*/
	vertical-align: middle;
	background:url(../image/common/icn_calendar01.png) no-repeat 0 0;
	background-size: contain;
	margin: 0 10px 0 0;
}
/*お知らせ(sp)**********/
#area_info	{margin-bottom: 2.5rem}
#area_info dl{
	font-size: 0.88rem;
	line-height: 175%;
	margin-bottom: 1.5rem;
}
#area_info dd{
	border-bottom: 1px dotted #736357;
	margin-bottom: 10px;
	padding-bottom: 8px;
}
#area_info p.bannar{
	border:1px solid #453d35;
	box-sizing: border-box;
}
/*カレンダー(sp)**********/
#area_calendar	{
	text-align: center;
	margin-bottom: 2.5rem
}
.box_calendar {
	position: relative;
	padding-bottom: 80%; /*アスペクト比 5:4の場合の縦幅*/
	height: 0;
	overflow: hidden;
}
.box_calendar iframe {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}



/*-------------------------------------------------------------------------------------------------------------------------------
	タブレット用（768px～）
---------------------------------------------------------------------------------------------------------------------------------*/
@media screen and (min-width:768px){

/*メインイメージ(tab)**********/
#mainImg01{
	background: #ededed url(../image/home/mainImg_02.jpg) no-repeat 0 0;
	margin-bottom: 3rem;
}
#mainImg02{
	padding-top:0%;
	max-width: 1300px;
	margin: 0 auto;
}
#mainImg02 .copy01{
	width: 40%;
	top: 8%;
	left:auto;
	right: 3%;
	text-align: center;
}
#mainImg02 .copy02{
	position: absolute;
	width: 20%;
	top: 37%;
	right: 22%;
	text-align: center;
}
#mainImg02 .copy03{
	position: absolute;
	width: 20%;
	top: 37%;
	right: 2%;
	text-align: center;
}
#mainImg02 .copy01 img{max-width: 483px;}
#mainImg02 .copy02 img{max-width: 240px;}
#mainImg02 .copy03 img{max-width: 240px;}

#mainImg02 .copy_italy{
	left: 57%;
	width: 40%;
	top: 12%;
}
/*緊急(tab)**********/
#area_important{
	margin-bottom: 2.5rem;
}

/*導入(tab)**********/
#area_intro	{margin-bottom: 4rem;}
#area_intro .head{margin: 0 auto 1.25rem auto;}
#area_intro .head_sub01{display: none;}
#area_intro .head_sub02{
	display:block;
	max-width: 825px;
	margin: 0 auto 1.25rem auto;
}
#area_intro .head_sub_italy{
	text-align: center;
}
#area_intro .head_sub_italy .in{
	font-size: 1.38rem;
}
ul.ul_intro01{
	padding: 1rem 0 0 0;
	margin-bottom: 1.5rem;
}
ul.ul_intro01:after{content:".";	display: block;	height:0px;	clear:both;	visibility:hidden;	font-size: 0.1em;	line-height:0;}
ul.ul_intro01 li{
	border-top: none;
	padding: 0;
	float: left;
	width: 45%;
	margin: 0 5% 0 2.5%;
}
ul.ul_intro01 li:nth-child(2){	margin: 0;}

/*特長(tab)**********/
#area_advantage	{/*margin-bottom:;*/}
#area_advantage .box_left	{float: left;	width: 56%;}
#area_advantage .box_right	{float: right;	width: 38%;}
#area_advantage .head_italy	{font-size: 1.5rem;}

/*お知らせ＆カレンダー見出し(sp)**********/
#area_info .head,
#area_calendar .head{
	font-size: 1.63rem;
}
/*お知らせ(tab)**********/
#area_info{
	float: left;
	width: 44.2%;
}
/*カレンダー(tab)**********/
#area_calendar{
	float: right;
	width: 50%;
}
/********/
}



/*-------------------------------------------------------------------------------------------------------------------------------
	PC用（1000px～）
---------------------------------------------------------------------------------------------------------------------------------*/
@media screen and (min-width: 1000px){

#mainImg02 .copy_italy{
	top: 18%;
	font-size: 1.63rem;
}
#area_advantage img.img_head	{margin: 1rem 0 1.5rem 0;}
/********/
}