/* 全てに適用するCSS */
/*ボディ*/
body{    
      font-family: 'メイリオ', Helvetica, 'Hiragino Kaku Gothic Pro', sans-serif; 
      font-size:16px; 
      font-weight:normal; 
      font-style:normal; 
      text-decoration:none; 
      background-color:#FFFFFF;
}


/* スマホだけに適用するCSS */
@media screen and (max-width:479px)
{
/* ボディ */
body{ 
      font-family: 'メイリオ', Helvetica, 'Hiragino Kaku Gothic Pro', sans-serif; 
      font-size:16px; 
      font-weight:normal; 
      font-style:normal; 
      text-decoration:none; 
      background-color:#FFFFFF;
     }
}



/* 全体(デスクトップPCとスマホ)に適用するCSS */

/* ヘッダー */
.header{
      background-color:#CCCCFF;           /*背景色*/
      text-align:center;                   /*テキスト，画像の中央寄席*/
      padding:5px 10px 5px 10px;          /*上下左右の余白*/
      border-bottom: 3px solid #FF0066;   /*下部ブロックとのスペース*/
      color: #000000;                     /*テキスト色*/
      height: auto;
 }


/* フッター */
.footer
 {
   width:auto; 
   height:auto;
   text-align:center;
   margin-right: auto;
   margin-left: auto;
   line-height:1.2;
   padding:20px;
   color:#FFFFFF;
   font-size:12px;
   font-weight:bold;
   background-color:#FF3377;
 }


/* 全体(デスクトップPCとスマホ)に適用するCSS */
.wrapper
 {
	width: 1100px ;
	margin: 0 auto ;	/* 左右に[auto]を指定することで、真ん中に寄る */
	padding: 0 ;		/* 上下左右の余白を0にしておく */
 }


/* スマホだけに適用するCSS */
@media screen and (max-width:479px)
{
.wrapper
 {
      width: auto ;
      padding: 0 10px ;
 }
}


/* 全体(デスクトップPCとスマホ)に適用するCSS */
.main
 {
      width: 760px ;
      padding: 10px ;		  /* 上下左右に10pxの余白 */
      border: 1px solid #CDCDCD ; /* 枠線 */
      margin-bottom: 20px
 }

.side
 {
      width: 298px ;
 }


/* スマホだけに適用するCSS */
@media screen and (max-width:479px)
{
.main
 {
      width: auto ;
      padding: 0 ;		/* 余白 */
      border: none ;		/* 枠線 */
 }


.side
 {
      width: auto ;
      
 }
}


/* 全体(デスクトップPCとスマホ)に適用するCSS */
.main
 {
      float: left ;		/* 左に寄せる */
 }

.side
{
      float: right ;		/* 右に寄せる */
      overflow: hidden;
      margin-top:20px;
}

/* スマホだけに適用するCSS */
@media screen and (max-width:479px)
{.main , .side

 {
      float: none ;
 }
}


.wrapper
 {
      overflow: hidden ;
 }


/* 見出し */

h1{
     color:#9400D3;
     font-size:13px;
     margin-left:10px;
     height:auto;
     padding:5px 10px 0px 10px;
     text-align:left;
}


h2{
   text-align:center;
   margin-top:10px;
   margin-right:5px;
   margin-left:5px;
   padding: 15px 0px 15px 0px;
   font-size: 16px;
   background-color:#FF3377;
   width:auto;
   height:auto;
   color:#FFFFFF;
 }


h3{
   text-align:center;
   margin-top:10px;
   margin-right:5px;
   margin-left:5px;
   padding: 15px 0px 15px 0px;
   font-size: 16px;
   background-color:#FF3377;
   width:auto;
   height:auto;
   color:#FFFFFF;
 }


h4{
margin: 10px;
padding: 5px 5px 5px 5px;
border-left: 12px solid #FF3377;
border-bottom: 5px dotted #FF3377;
background-color: #FFFFFF;
font-size: 16px;
font-weight: bold;
color: #FF3377;
text-align: left;
}


h5{
   margin-top:0px;
   margin-left:16px;
   margin-bottom:10px;
   padding: 10px 0px 0px 25px;
   font-size: 16px;
   background:url(image/h5_bullet.png) no-repeat 0 12px;
 }


h6{
   margin-top:0px;
   margin-left:10px;
   margin-bottom:15px;
   padding: 10px 0px 0px 25px;
   font-size: 16px;
   background:url(image/h6_bullet.png) no-repeat 0 12px;
 }



/* 段落 */

.s1{margin:0px 20px 20px 20px; line-height:1.8;}

.s2{margin:-10px 20px 0px 20px; line-height:1.8;}

.s3{margin:-20px 20px 10px 20px; line-height:1.8;}

.s4{margin:10px; font-size:14px;}


/* リスト */

.ul{margin:0px 10px 0px 10px; line-height:1.8;}

.ol{margin:0px 10px 0px 10px; line-height:1.8;}

/* ソーシャルボタン */
#sns-b{
	margin: 10px 0;
	float: right;
}
.sbox {
	display: inline-block;
	padding: 0 5px 5px 0;
	float: left;
}


.span{
	padding: 0 0.2em;
	position: relative;
        font-size:13px;
}

/* afterで丸枠を生成 */
.span::after {
	content: '';
	position: absolute;
	display: block;
	top: 47%;
	left: 1px;
	transform: translateY(-50%);
	width: 1.2em;
	height: 1.2em;
	border: 1px solid #454545;
	border-radius: 50%;
}





/*通常、使用せず_ここから*/
/* ロゴ画像を囲むh1 */
.logo-wrapper
 {
      margin: 0 ;
      padding: 0 ;
      line-height: 1 ;
 }


/* ロゴ画像 */
.logo
 {
      width: 400px ;
      height: auto ;
 }


/* スマホだけに適用するCSS */
@media screen and (max-width:479px)
{
/* ロゴ画像 */
 .logo
  {
      width: 200px ;
 }
}
/*通常、使用せず_ここまで*/