/* CSS Document */

body { color: #666; font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro","游ゴシック体", "Yu Gothic", YuGothic, "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "Osaka", Verdana, Arial, sans-serif; word-wrap: break-word; -webkit-text-size-adjust: 100%;}

#content{background: #fff; width: 100%; min-width: 1280px;}

/* nav */
.nav{ width: 100%; min-width: 1280px; margin: 0 auto;}

/* mainvisual */
.mainvisual{ position: relative; width: 1280px; margin: 0 auto;}
.mainvisual .menu{ width: 1000px; margin: 70px auto 200px; display: block; font-size: 0;}
.mainvisual .menu li{ border-left: 1px solid #000; padding: 0 62px; display: inline-block; vertical-align: middle;}
.mainvisual .menu li:last-child{ border-right: 1px solid #000;}

/* section */
section{ width: 1080px; margin: 0 auto 130px; padding-bottom: 130px; text-align: left; position: relative;}
section:after{ position: absolute; content: ''; width: 818px; height: 17px;display: block; background: url("../../WEEKEND2022/img/bg_line_pc.png") no-repeat; background-size: 100% auto; left: 50%; transform: translateX(-50%); bottom: 0;}

section img{ width: 100%; height: auto;}
section h2{ margin-bottom: 25px; width: 169px;}
section h3{ margin-bottom: 30px; margin-left: 50px; width: 578px;}
section .lead{ width: 640px; margin-bottom: 30px; margin-left: 50px; font-size: 16px;}
section .lead .notice{ display: block; font-size: 11px; text-indent: -1em; padding-left: 1em;}
section .lead small{ font-size: 12px;}


section .greenWrap01{ width: 690px; margin: 0; padding: 25px; background: #F5F8ED;}
section .greenWrap01 dl{ overflow: hidden; border-bottom: 1px solid #C4C4C4; margin-bottom: 15px; padding-bottom: 15px;}
section .greenWrap01 dl:last-child{ border-bottom: none; margin-bottom: 0; padding-bottom: 0;}
section .greenWrap01 dl dt{ float: left; margin-right: 5px; position: relative; font-size: 18px; font-weight: bold;}
section .greenWrap01 dl dt:before{ content: ''; width: 15px; height: 15px; margin-right: 5px; display: inline-block; background: url("../../WEEKEND2022/img/icon_square.png") no-repeat; background-size: 100% auto;}
section .greenWrap01 dl dd{ float: left; font-size: 14px; margin-top: 4px;}
section .greenWrap01 dl dd a{ color: #666;}
section .greenWrap01 dl dd a:hover{ text-decoration: none;}

section .bg_img01{ position: absolute; top: 0; right: 0; width: 372px;}
section .bg_img02{ position: absolute; top: 395px; right: 15px; width: 283.5px;}

/* event2 */
section#event2 h2{ margin-left: 365px;}
section#event2 h3{ margin-left: 405px; width: 444px;}
section#event2 .lead{ margin-left: 415px;}
section#event2 .greenWrap01{ margin-left: 340px;}
section#event2 .bg_img01{ position: absolute; top: 0; left: 0; right: auto; width: 372px;}
section#event2 .bg_img02{ position: absolute; top: 400px; left: 0; right: auto; width: 283.5px;}

/* event3 */
section#event3{ padding-bottom: 80px;}
section#event3 h3{ width: 582px;}
section#event3 .lead{ width: 610px;}
section#event3 .bg_img01{ position: absolute; top: 95px; right: 0; width: 389px;}

/* event4 */
section#event4{ margin-bottom: 400px; padding-bottom: 0;}
section#event4:after{ display: none;}
section#event4 h2{ margin-left: 365px;}
section#event4 h3{ margin-left: 405px; width: 356px;}
section#event4 .lead{ margin-left: 415px;}
section#event4 .bg_img01{ position: absolute; top: 0; left: 0; right: auto; width: 372px;}


@media screen and (max-width: 768px){
	#content{ width:100%; min-width:inherit;}
	
	
	/* nav */
 .nav{ width: 100%; min-width: 0;}
	
	/* mainvisual */
	.mainvisual{ width:100%; margin: 0 auto;}
	.mainvisual img{ width: 100%; height: auto;}
 .mainvisual .menu{ width: auto; margin: 0 0 70px;}
 .mainvisual .menu li{ border-left: none; padding: 0; display: block;}
 .mainvisual .menu li:last-child{ border-right: none;}

	/* section */
	section{ width: auto; margin: 0 15px 65px; padding-bottom: 65px;}
	section:after{ width: 301px; height: 17px; display: block; background: url("../../WEEKEND2022/img/bg_line_sp.png") no-repeat; background-size: 100% auto; left: 50%; transform: translateX(-50%); bottom: 0;}
	section h2{ width: 110px; margin-bottom: 25px; margin-left: 15px !important;}
	section h3{ width: 276px; margin: 0 15px 30px 30px !important;}
	section .lead{ width: auto; margin: 0 15px 30px 30px !important; font-size: 14px;}
	section .lead small{ font-size: 10px;}
	section .lead .notice{ margin-top: 5px;}
	section .greenWrap01{ width: auto; margin: 40px 0 15px !important; padding: 15px;}
	section .greenWrap01 dl dt{ float: none;}
	section .greenWrap01 dl dt{}
	section .greenWrap01 dl dd{ float: none;}
	section .greenWrap01 dl dd small.lh{ display: inline-block; line-height: 1.6; margin-top: 5px;}
	
	section .spImgCol{ display: table; margin: 0 auto;}
	section .bg_img01{ position: static; width: 320px; display: block; vertical-align: middle;}
 section .bg_img02{ display: none;}
	
	/* event2 */
	section#event2 h3{ width: 292px;}
	section#event2 .bg_img01{ position: static; width: 310px; display: block;}
	section#event2 .bg_img02{ display: none;}

	/* event3 */
	section#event3{ padding-bottom: 65px;}
	section#event3 h3{ width: 303px;}
	section#event3 .lead{ width: auto;}
	section#event3 .bg_img01{ position: static; width: 195px; display: block; margin: 0 auto;}

	/* event4 */
	section#event4{ margin-bottom: 150px; padding-bottom: 0;}
	section#event4 h3{ width: 275px;}
	section#event4 .bg_img01{ position: static; width: 188px; display: block; margin: 0 auto;}

}
