@charset "utf-8";

/* @group Reset */

*{ margin: 0;padding: 0}

a { text-decoration : none}
ul, ol { list-style : none}
img { vertical-align : middle}

/* @end */


/* @group Fluid-img */

img { max-width : 100%}

/* @end */


/* @group HTML */

html {
font-family : verdana, sans-serif;
font-size : 75%; /*レスポンシブタイプセッティングの指定*/
line-height : 1.5}

/* @end */


/* @group Heading */

hgroup {
width : 91.796875%; /*940/1024*/
margin : 0 auto }

hgroup h1 {
width : 90%;
text-align : left;
} 

h2 {
font-size : 2.25em; /* 36px */
line-height : 1.3333; /* 48px */
margin-bottom : 0.6667em } 

h3 {
font-size : 1.5em; /* 24px */
line-height : 1; /* 24px */
margin-bottom : 1em } 

hgroup h2,h4,h5,h6 {
font-size : 1em; /* 16px */
line-height : 1.5; /* 24px */
margin-bottom : 1.5em } 

/* @end */

/* @group Header */

header { 
text-align : center;
padding-top : 1.5em;
background : #FFF}

header h1 { margin-bottom : 0.5em}
header h2 { color : #2f1f1f}

/* @end */

/* @group Nav */

nav {
margin-bottom : 1.5em;
background-color: #E3E3E3;
background: -moz-linear-gradient(top, #E3E3E3) 0%, rgba(209,189,189,1.00) 80%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#E3E3E3), color-stop(80%,rgba(209,189,189,1.00))); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top, #E3E3E3) 0%,rgba(209,189,189,1.00) 80%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top, #E3E3E3) 0%,rgba(209,189,189,1.00) 80%); /* Opera 11.10+ */
background: linear-gradient(to bottom, #E3E3E3) 0%,rgba(209,189,189,1.00) 80%); /* W3C */
}



nav ul { overflow : hidden}
nav ul li { width : 20%; float : left}
nav ul li a {
display : block;
color : #C54372;
padding : 0.75em 0}

nav ul li a:hover {
color : #2f1f1f;
background-color : #E3E3E3}

/* @end */



/* ＠iflameのレスポンシブ */

.p-youtube {
  width: 100%;
  aspect-ratio: 16 / 9;
}
.p-youtube iframe {
  width: 100%;
  height: 100%;
}

/* @end */




/* @group Contents */

#contents {
width : 90%;
margin : 0 auto;
text-align : center}

#contents video {
width : 100%;
margin : 0 auto;
text-align : center}


#contents p { 
margin-bottom : 1.5em;
text-align : left}

#contents img { 
margin-bottom : 1.5em; 
box-shadow : 0 0 5px #2f1f1f}

/* @end */

/* @group Footer */

footer {
clear:both;
padding : 1.5em 0;
text-align : center;
background:url(../images/footer.jpg) repeat-x;
background-position:top;
background-color:#FCC;
}

/* @end */

/*768px*/
@media screen and (min-width : 768px){

html{ font-size : 87.5%} /*レスポンシブタイプセッティングの指定*/
#contents { text-align : left}

}

/*1024px*/
@media screen and (min-width : 1024px) {

html{ font-size : 100%} /*レスポンシブタイプセッティングの指定*/

/* @group Nav */

nav ul {
width : 93.75%;/* 960/1024 */
margin : 0 auto}

/* @end */

/* @group Contents */

#contents {
overflow : hidden;
width : 93.75%}

#contents #main { 
margin : 0 auto;} 

#contents #main { width : 64.5833333%}

/* @end */


/* @group Footer */

footer {
width : 91.796875%; /*940/1024*/
margin : 0 auto}

/* @end */

}