@charset "utf-8";

/*全端末（PC・タブレット・スマホ）共通設定
------------------------------------------------------------------------------------------------------------------------------------------------------*/
body {
	margin: 0 auto;
	padding: 0px;
    max-width: 1200px;
    color: #333;
	font-family: "ヒラギノ丸ゴ Pro", "Hiragino Maru Gothic Pro","ヒラギノ角ゴ Pro", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;	/*フォント種類*/
	font-size: 18px;	/*文字サイズ*/
	line-height: 1.9;		/*行間*/
	background:rgba(255,237,238,0.94);	/*背景色　元は#fff*/
	-webkit-text-size-adjust: none;
}
h1,h2,h3,h4,h5,p,ul,ol,li,dl,dt,dd,form,figure,form {margin: 0px;padding: 0px;font-size: 100%;font-weight: normal;}
ul {list-style-type: none;}
ol {padding-left: 40px;padding-bottom: 15px;}
img {border: none;max-width: 100%;height: auto;vertical-align: middle;}
table {border-collapse:collapse;font-size: 90%;border-spacing: 0;}
iframe {width: 100%;}
audio {width: 260px;height:26px;}

/*--Slickのドットの設定--*/
/*丸いページナビボタン全体を囲むブロック*/
ul.slick-dots {
	margin:0;padding: 0;
	line-height: 1;
	width: 100%;
	text-align: center;
	position: absolute;
	bottom: -30px;	/*下からの配置場所指定。ボタンを画像の下に移動します。*/
}

/*丸いページナビボタン１個あたりの設定*/
ul.slick-dots li {
	display: inline-block;
	margin: 0 10px;
	cursor: pointer;
}

/*buttonタグ*/
ul.slick-dots li button {
	border: none;padding: 0;
	display: block;
	text-indent: -9999px;	/*デフォルトで文字が出るので画面の外に追い出す指定*/
	width: 12px;			/*ボタンの幅*/
	height: 12px;			/*ボタンの高さ*/
	border-radius: 50%;		/*丸くする指定*/
	cursor: pointer;		/*クリックで画像へジャンプするので、わかりやすいようhover時にpointerになるように。*/
	background: #ccc;		/*背景色。白。*/	
}

/*buttonのアクティブ時（現在表示されている画像を示すボタン）*/
ul.slick-dots li.slick-active button {
	background: #ba1313;	/*色*/
}


/*リンク（全般）設定
---------------------------------------------------------------------------*/
a {
	color: #333;		/*リンクテキストの色*/
	transition: 0.2s;	/*マウスオン時の移り変わるまでの時間設定。0.2秒*/
    text-decoration: none;
}
a:hover {
	color: #1647a8;			/*マウスオン時の文字色*/
	text-decoration: none;	/*マウスオン時に下線を消す設定。残したいならこの１行削除。*/
}
.modoru {
    width: 200px;
    position:relative;
    left: 5%;
    top: -10px;
    font-size: 90%;
}


/*コンテナー（ホームページを囲むブロック）
---------------------------------------------------------------------------*/
#container {
	max-width: 1120px;	/*slide.cssの「#mainimg, #subimg」と設定と合わせる*/
	margin: 0 auto;
	border-top: 4px solid #D37577;	/*一番上に入っているアクセントライン。幅、線種、色。*/
}

/*ヘッダー
---------------------------------------------------------------------------*/
/*ヘッダーブロック*/
#topdl  {
    position: relative;
    z-index: 1;
    margin: 0px auto;
    max-width: 1200px;
    height: auto;	/*ヘッダーの高さ*/   
}
#topmini {
    display: none;
}
header {
	position: relative;
    z-index: 1;
	height: 66px;	/*ヘッダーの高さ*/
	background: #fff;	/*背景色*/
}
/*ロゴ画像*/
header #logo img {
	width: 240px;	/*画像幅*/
	position: absolute;
	left: 3%;		/*ヘッダーに対して左から3%の場所に配置*/
	top: 16px;	/*ヘッダーに対して上からの場所*/
}
.topshort {display: block;}
.topshort2 {display: none;}



/*フォームのみのヘッダー設定--------------------------*/
.formstyle header {
	position: relative;
    z-index: 1;
	height: 110px;
	background: #fff;	
}

/*ヘッダー内メニュー
色などの他の指定は下の方の「a.btn1」で指定。
---------------------------------------------------------------------------*/
/*メニューブロック全体*/
#headermenu {
	position: absolute;
	right: 4%;		/*headerに対して右から3%の場所に配置*/
	bottom: 10px;	/*headerに対して下から15pxの場所に配置*/
}
/*メニュー１個あたり*/
#headermenu li {
	float: left;	/*左に回り込み*/
	margin-left: 10px;	/*メニュー同士の余白*/
    font-size: 70%;
}
#headermenu li a.btn1 {
	padding: 0px 15px 0px 30px;	/*上、右、下、左へのボックス内の余白*/
}

#contents {
	clear: both;
    overflow: hidden;
    position: relative;
	background: rgba(255,237,238,0.94);   /*元は#fff*/
	padding: 1% 3%;		/*上下、左右へのボックス内の余白*/
	margin: 0px 0px 15px;	/*上、左右、下へのボックスの外側への余白*/
}
/*--シンプルなナビ------*/
#menuword {
    margin: 0 auto 20px;
    padding: 16px 4%;
}
#menuword li {
    list-style-type: none;
    float: left;
    margin-left: 4px;
    margin-bottom: 5px;
    padding: 0px 8px;
    font-size: 70%;
    border: 2px solid #E44E53;
    border-radius: 18px;
    background-color: #FFFFFF;
}

.dlpointall {
    display: flex;
    flex-direction: column;
    font-size: 98%;
}
.dlpointall h3 {
    font-size: 120%;
    font-weight: 700;
    background-color: hsla(0,0%,100%,0.80);
    border-radius: 7px;
    padding-top: 5px;
    padding-right: 8px;
    padding-left: 8px;
    text-align: left;
    margin-bottom: 15px;    
}
.ptimg {
    width:60px;
    margin-bottom: 2px;
    }  
.pointimg {
    width: 60%;
    padding: 20px 0px 10px 0px;
}
.dlpoint1 {
    width:70%;
    padding: 20px;
    margin-left: 0;
}
.dlpoint2 {
    width:70%;
    padding: 20px;
    margin-left: 25%;
}


.topnav {
    overflow: hidden;
    margin: 8vh 0 0;
    padding: 0 2%;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;   
} 
.topnav img{
    width: 140px;
    height: auto;
    margin: 10px 5px;
}
.gainatesaki2 {
    margin-left: 10px;
    padding: 5px 8px;
    width: 250px;
    background-color: #FFF;
    border: 3px solid #D37577;
    font-size: 80%;
    border-radius: 9px;
}

.bigbutton {
    margin: 10px auto 20px;
    padding: 0px 2%;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    }
.bigbutton img {
    width: 210px;
    height: auto;
    margin: 8px 10px;
    }
.dlshop #contents h2 {margin: 0 auto 20px;}

#newhu img {margin-left: -20px; }    
.kigou {
    margin: 0px 20% 5px;
    padding: 10px;
    font-size: 73%;
    text-align: center;
    border: 1px solid #FB8E91;
    line-height: 30px;  
}
.kigou img {height: 25px;}
.space p{font-size: 90%;}
.midasi {
    margin: 0 auto;
    padding: 10px 200px 0px;
    text-align: center;
    font-size: 75%;}

.listwrap {
    margin: 10px auto 30px;
    padding: 0px;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
}
.mgroup {
    min-width: 44%;
    margin: 10px 10px;  
}
.mgroup h3 {
    font-size: 96%;
    margin-bottom: 5px;
} 
.mgroup h3 a {text-decoration: none;}
.mgroup h3 img {width:25px;margin-top: -4px;} 

.slist {
    margin-bottom: 6px;
    padding: 4px 8px 4px 8px;
    background-color: #FFFFFF;
    border: 1px solid #B8B8B8;
    -webkit-box-shadow: 2px 2px rgba(118,118,118,0.78);
    box-shadow: 2px 2px rgba(118,118,118,0.78);
    background-image: -webkit-linear-gradient(90deg,rgba(255,255,255,1.00) 0%,rgba(255,255,255,1.00) 69.79%,rgba(147,214,252,1.00) 100%);
    background-image: -moz-linear-gradient(90deg,rgba(255,255,255,1.00) 0%,rgba(255,255,255,1.00) 69.79%,rgba(147,214,252,1.00) 100%);
    background-image: -o-linear-gradient(90deg,rgba(255,255,255,1.00) 0%,rgba(255,255,255,1.00) 69.79%,rgba(147,214,252,1.00) 100%);
    background-image: linear-gradient(0deg,rgba(255,255,255,1.00) 0%,rgba(255,255,255,1.00) 69.79%,rgba(147,214,252,1.00) 100%);
}
.m1 {
    display: flex;
    flex-direction: row;
    justify-content:space-between;
    font-size: 87%;
    padding: 0 5px;
}
.sz-m {font-size: 84%;padding-top: 2px;}
.m2 {display: flex;
    flex-direction: row;
    justify-content:space-between;
    font-size: 75%;
    padding: 0 5px;
    line-height: 1.4;
}
.sz-s {font-size: 83%;padding-top: 2px;padding-left: 6px;}

.onp img {width:26px;margin-top: -6px;}
.onp {font-size: 80%;}

/*--曲リストのブロック--*/

.block2 {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    margin: 20px auto 30px;
    padding: 0px;
} 
.ta22 {
    width: 46%;
    background-color: #fff;
    margin: 5px auto 5px;
    padding: 10px;
    font-size: 88%;
    -webkit-box-shadow: 2px 2px 0px 0px rgba(163,163,163,0.59);
    box-shadow: 2px 2px 0px 0px rgba(163,163,163,0.59);
}
.ta22 table {border: rgba(250,200,161,1.00);}
.ta22 td {line-height: 1.4;padding:5px;}
.song {font-size: 104%;}
.kana {font-size: 88%;}
.artist {font-size: 90%;}
.price {font-size: 98%;}
.hosi {font-size: 88%;}
.scart img {width:77px;height: auto;}
.tokuten {font-size: 90%;}
.page {font-size: 90%;}
.oto {font-size: 92%;background: #C1E6FA;}
.ytimg {width: 130px;height: auto;}


/*storesにリンクする購入ボタンの表*/

.stores th {font-weight: 600;background: rgba(248,175,119,0.90)}
.stores tr {
    text-align: center;
    font-size: 90%;
}
#footbox {
    clear: both;
    margin: 0 auto;
    padding: 10px;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    }   
/*許諾スペース*/
.kyodaku {
    width: 310px;
    padding: 10px 10px 0px 0px;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-around;
}
.kyodaku img {width: 90px;}
.kyodaku p {
    font-size: 65%;line-height: 1.4;padding-top: 5px;
}
.mschol {
    width: 170px;
    height: auto;
    padding: 13px 0px 10px 20px;  
}
/*--会社概要ページの表　ta2---*/
.ta2 {
	table-layout: fixed;
	margin: 5px auto 40px;
}
.ta2, .ta2 td, .ta2 th {
	border: 1px solid #999;	/*テーブルの枠線の幅、線種、色*/
	line-height: 1.7;
    font-size: 89%;
	padding: 12px;	/*ボックス内の余白*/
    }
.ta2 th {
	text-align: center;
	background: rgba(250,198,158,0.6);
}
.ta2 td {
    text-align: left;    
}

.polcy {margin: auto;padding: 0px 5px;line-height: 1.7;}
.polcy p {
    font-size: 88%;
    margin-bottom: 10px;
    text-align: justify;}
.polcy h5 {font-size: 95%;}

/*btn1
---------------------------------------------------------------------------*/
/*btn1共通*/
a.btn1 {
	text-decoration: none;
    display: inline-block;
	background: #D37577 url(../images/arrow1.png) no-repeat 15px center;	/*古いブラウザ用*/
	background: #D37577 url(../images/arrow1.png) no-repeat 15px center / 6px;	/*背景色、背景の矢印画像の読み込み、左から15pxの場所に配置。幅を6pxに。*/
	color: #fff;
	border: 1px solid #D37577;
	border-radius: 2px;			/*角丸のサイズ。*/
}
/*マウスオン時*/
a.btn1:hover{
	background: #D37577 url(../images/arrow1.png) no-repeat 15px center / 6px;
}
/*contents内のbtn1*/
#contents a.btn1 {
	padding: 0px 35px 0px 50px;	/*上、右、下、左へのボックス内の余白*/
	letter-spacing: 0.2em;		/*文字間隔を広くとる設定*/
}

/*メインメニュー
---------------------------------------------------------------------------*/
/*デフォルトのメニューブロック*/

.mask {
    width: auto;
    height: 90px;
    object-fit: cover; /*写真の高さだけ切り取り*/
}

/*トップページのメニューブロック*/
#menubar {
    clear: both;
    position: relative;
    z-index: 1;
	margin-left: 5%;	/*左に空けるスペース*/
    font-size: 70%;	/*70% メニューのテキストが段落ちするので、縮小する。*/
	margin-top: 40%;	/*上に空けるスペース。この部分にスライドショーが表示される。*/
}


/*メニュー１個あたりの設定*/

#menubar li {
	float: left;	/*左に回り込み*/
	width: 15%;		/*メニュー幅*/
	margin: 20px 0.4%;	/*トップページ以外のメニューバーの高さ設定*/
}
#menubar li a {
    display: block;
    text-decoration: none;
    position: relative;
    text-align: center;	/*内容をセンタリング*/
    padding: 15px 0;	/*上下、左右へのボックス内の余白*/
    background: #fff;	/*背景色（古いブラウザ用）*/
    background: rgba(255,255,255,0.85);	/*背景色。255,255,255は白の事で0.85は85%色がついた状態の事。*/
    font-size: 16px;
    border: 1px solid #f58631;
}
/*飾り文字*/
#menubar li span {
	display: block;
	font-size: 80%;	
	color: #e5831f;	
	letter-spacing: 0.2em;
}
/*飾り文字のマウスオン時、現在表示中(current)時*/
#menubar li a:hover span,
#menubar li.current a span {color: #fff;}

/*メニュー下の「▼」マーク。吹き出し風に。*/
#menubar li.current a span::after {
	content: "▼";	/*このテキストを表示。機種依存文字は化ける場合があるので使わない*/
	color: #e5831f;	
	font-size: 20px;
	position: absolute;
	bottom: -22px;	/*下側に22px下げる*/
	left: 45%;		/*左から45%の場所に配置*/
}

/*マウスオン時と、現在表示中(current)メニューの設定*/
#menubar li a:hover,
#menubar li.current a {
	background: #e5831f;
	color: #fff;
	padding: 15px 0;	/*上下、左右へのボックス内の余白*/
}
/*スマホ用メニューを表示させない*/
#menubar-s {display: none;}
/*３本バーアイコンを表示させない*/
#menubar_hdr {display: none;}
/*---３本バーブロック ここでは見えない---------------*/
#menubar_hdr {
	display: none;
	position: absolute;z-index: 2;
	top: 29px;
	right: 4%;
	border: 1px solid #fff;
}
/*------アイコン共通設定　ここでは使用しない--------*/
#menubar_hdr.close,
#menubar_hdr.open {
	width: 50px;
	height: 50px;
}
/*---三本バーアイコン　背景色、背景画像の読み込み、画像の上半分（３本マーク）を表示。幅は50px。------*/
#menubar_hdr.close {
	background: #e5831f url(../images/icon_menu.png) no-repeat center top/50px;	
}
/*---閉じるアイコン　背景色、背景画像の読み込み、画像の下半分（×マーク）を表示。幅は50px。---*/
#menubar_hdr.open {
	background: #e5831f url(../images/icon_menu.png) no-repeat center bottom/50px;
} 





/*mainのほうのsection同士の余白*/
#contents section + section {
	margin-top: 45px;
}

/*コンテンツを左右に分割する場合--------------------------*/
/*メインコンテンツ*/
#formstyle #contents .main {
    width: 94%;
    margin: auto;
}
#contents .main {
	float: left;	/*左に回り込み*/
	width: 70%;		/*コンテンツ幅*/
}
/*サブコンテンツ*/
#contents .sub {
	float: right;	/*右に回り込み*/
	width: 27%;		/*コンテンツ幅*/
}

/*サブコンテンツの設定----------------------*/
/*サブコンテンツのh2タグ*/
#contents .sub h2 {
	font-size: 92%;
    line-height: 22px;
	margin-bottom: 8px;
	text-align: left;
}
/*サブコンテンツのh2タグの１文字目への設定*/
#contents .sub h2::first-letter {
	padding-left: 15px;		/*アクセントラインとテキストとの余白*/
    border-left: 3px solid #fff;
}
/*サブコンテンツの段落タグ設定*/
#contents .sub p {
	padding: 0;
	font-size: 90%;
}
/*section同士の余白*/
#contents .sub section + section {
	margin-top: 10px;
}

/*サブコンテンツ内のbox1-------------------------------------*/
.subgrp {
    margin-bottom: 10px;
}
.sub .box1 {
	padding: 10px;			/*ボックス内の余白*/
    background: rgba(245,134,49,0.60);
	border: solid 1px #dcdcdc;	/*線の線種、幅、色*/
	box-shadow: 0px 0px 1px 1px #fff inset;	/*ボックスの影。内側に白のラインを入れる。*/
}
/*box1内のメニューの設定*/
.sub .box1 ul {
    background: #fff;	/*背景色*/
	border-bottom: solid 1px #dcdcdc;	/*下の線の線種、幅、色*/
	border-top: solid 1px #dcdcdc;	/*上の線の線種、幅、色*/
    margin-bottom: 0px;	/*メニューブロックの下に空けるスペース*/
}
.sub .box1 li {
    border-bottom: solid 1px #dcdcdc;
    line-height: 140%;
    font-size: 75%; 
    padding:6px 6px;
}
.sub ul li a {
    text-decoration: none;
    display: block;
}
/*連絡先はこちらのボックス*/
.sub .box2 {
	padding: 10px;
    background: rgba(251,227,131,1.00);
	border: solid 1px #dcdcdc;
	box-shadow: 0px 0px 1px 1px #fff inset;
}
.sub .box2 ul { 
    background: #fff;
	border-bottom: solid 1px #dcdcdc;
	border-top: solid 1px #dcdcdc;
    margin-bottom: 0px;  
}
.sub .box2 li {
    border-bottom: solid 1px #dcdcdc;
    font-size: 75%;
    line-height: 160%;
    padding: 5px 6px;	
}
/*box4　青いやつ*/
.sub .box4 {
	padding: 10px;
    background: rgba(82,187,246,0.85);
	border: solid 1px #dcdcdc;
	box-shadow: 0px 0px 1px 1px #fff inset;
}
.sub .box4 ul { 
    background: #fff;
	border-bottom: solid 1px #dcdcdc;
	border-top: solid 1px #dcdcdc;
    line-height: 140%;
    margin-bottom: 0px;   
}
.sub .box4 li {
    border-bottom: solid 1px #dcdcdc;
    font-size: 75%;
    padding: 5px 6px;
}
/*box6　更新情報お知らせ*/
.sub .box6 {
	padding: 10px;
    background: rgba(248,124,30,1.00);
	border: solid 1px #dcdcdc;
	box-shadow: 0px 0px 1px 1px #fff inset;
}
.sub .box6 ul { 
    background: #FED8BB;
	border-bottom: solid 1px #dcdcdc;
	border-top: solid 1px #dcdcdc;
    line-height: 110%;
    margin-bottom: 0px;   
}
.sub .box6 li {
    border-bottom: solid 1px #dcdcdc;
    font-size: 75%;
    padding: 2px 6px;
}

/*--box3　ベスト曲の緑のボックス-----*/
.sub .box3 {
	padding: 10px;
    background: rgba(70,167,16,0.60);
	border: solid 1px #dcdcdc;
	box-shadow: 0px 0px 1px 1px #fff inset;
}
.sub .box3 ul {
	margin-bottom: 4px;
    border-top: solid 1px #dcdcdc;
    background: #fff;
}
.sub .box3 li {
	border-bottom: solid 1px #dcdcdc;
    font-size: 75%;
    line-height: 105%;
	padding: 5px 5px;
}
/*box5　バナー用*/
.sub .box5 {
	padding: 0px;			
}
.sub .banner-s{
    display: flex;
    flex-direction: column;
    margin: 0px 0;padding: 6px 6px;
    -webkit-box-shadow: 1px 1px 4px 1px rgba(173,173,173,0.5);
    box-shadow: 1px 1px 4px 1px rgba(173,173,173,0.5);
}
.backc1 {background:rgba(225,255,228,0.80);}

/*ページ内専用メニュー　------------------------------------------*/
.nav {
	text-align: center;
	margin-bottom: 40px;
	background: #eee;
	padding: 10px;
}
.nav li {
	display: inline-block;
	padding: 0 10px;
}
.nav li::before {
	content: "> ";
	color: #e5831f;
}
/*--臨時に広告を入れるためのスペース-------*/
.pop {
  margin: auto;
  padding: 0 8% 15px;    
}
.pop2 {
  margin: auto;
  padding: 0 2% 15px;     
}
.pop2 p {
    font-size: 92%;
    margin : 15px 0;
}
.maeoki {
    position: relative;
    margin: 30px 4%;
    padding: 20px 20px;
    font-size: 88%;
    line-height: 1.8;
    text-align: justify;
    border: 2px solid #D37577;
    background-color: #FFFFFF;
 }
.maeoki-in {
    position: absolute;
    top: 0;left: 0;
}
.maeoki-in img {width: 36px;padding: 4px 8px;}

/*質問ページ　---------------------------*/

.dlfaq {
    margin: 20px auto;
    padding: 5px 30px 20px;
    background-color: #fff;
}
.dlfaq h3 {
    margin: 40px 0px 0px;
    font-size: 120%;
}
.dlfaq h3 img {
    height: 50px; 
}
.faq {
    margin: 0 0 10px;
	padding: 2px 10px;
}

/*質問の設定*/
.faq dt {
	color: #000;
	padding-top: 20px;
	margin-bottom: 10px;
    font-size: 86%;
    text-align: justify;
}
/*回答の設定*/
.faq dd {
	border-bottom: 1px solid #ccc;
	overflow: hidden;
	padding-bottom: 15px;
    font-size: 86%;
    text-align: justify;
}
/*「Q」と「A」のマーク共通設定*/
.faq dt::before,
.faq dd::before {
	margin-right: 5px;display: inline-block;text-align: center;
	width: 26px;
	line-height: 26px;
}
/*「Q」のマーク追加設定*/
.faq dt::before {
	content: "Q";			/*「Q」の文字を出力する設定*/
	background: #D75B5E;	/*背景色*/
	color: #fff;			/*文字色*/
}
/*「A」のマーク追加設定*/
.faq dd::before {
	content: "A";		/*「A」の文字を出力する設定*/
	background: #999;	/*背景色*/
	color: #fff;		/*文字色*/
}
/*---ガイド内の決済の表---------*/
#contents .main h2 {
    clear: both;
    margin: 10px auto 0px;
    padding: 3px;
    font-size: 130%;
    line-height: 1.8;
    text-align: center;
    border: medium dotted #EF8081;
    background-color: #FFFFFF;
}
#contents h2 img {height:50px;width :auto;}

.dlguide {
    margin: 10px auto 40px ;
    padding: 20px 30px;
    background-color: #fff;   
}
.dlguide h3 {
    margin: 0 0 25px;
    font-weight: 500;
    font-size: 120%;
    -webkit-box-sizing: content-box;
    -moz-box-sizing: content-box;
    box-sizing: content-box;
    border-radius: 14px;
    color: #FFFFFF;
    background-color: #D37577;
}
.storehyou {
    margin: 20px 10% 50px;
    display: flex;
    justify-content: center;
    font-size: 95%;
}
.tamesi {padding: 20px 2%;}
.freeitem td{
    font-size: 95%;    
}
.freeitem img {width:160px;}
.honbun {
    margin-bottom: 17px;
    padding: 0 5% 0;
    font-size: 92%;
    line-height: 1.8;
    text-align: justify;
}
.tejun {
    padding: 5px 2% 30px;   
}
.tejun h5 {font-size: 95%;}
.tejunzu {
    width: 94%;
    margin: auto;
    font-size: 88%;
    line-height: 1.6;
}
.tdimg {
    width: 33%;
    height: auto;
}
.tdimg img {
    width: 80%;height: auto;
    padding-bottom: 10px;
}
.tdimg2 {width: 38%;height: auto;}
.tdimg2 img {width: 100%;height: auto;padding-bottom: 5px;}
.tdimg3 {width: 36%;height: auto;}
.tdimg3 img {width: 80%;height: auto;padding-bottom: 5px;}


.gainatesaki {
    padding: 5px 10px;
    margin: 0px auto 0px;
    width: 350px;
    background-color: #FFF;
    border: 3px solid #D37577;
    font-size: 80%;
    border-radius: 9px;
}
.gainatesaki3 {
    padding: 5px 10px;
    margin: 0px auto 0px;
    width: 350px;
    background-color: #FFF;
    border: 3px solid #D37577;
    font-size: 80%;
    border-radius: 9px;
}

/*---本文　いろいろ共通　--------------*/

.just {
    text-align: justify;}

.atama1 {
    color: #fff;
    background-color: #D37577;
    padding: 3px;
}

/*------各ページの設定----------------------*/
/*----トップページ----*/
.ofh {overflow: hidden;
    margin-bottom: 30px;
    width: 100%;
}


/*h3の頭のマーク*/
.mark1 {
    width: 46px;
    height: auto;
    margin-bottom: 6px;
    margin-right:-5px;
}  

.banner {
    margin-bottom: 2px;
    -webkit-box-shadow: 1px 1px 4px 1px rgba(173,173,173,0.5);
    box-shadow: 1px 1px 4px 1px rgba(173,173,173,0.5);
}
.banner p {
    font-size: 70%;
    line-height: 1.5em;
    text-align: left;
    margin: 4px 0;
}

/*トップページ内の更新情報ブロック-----------------------------------*/
.gaiyou h4 {
    font-size: 100%;
}
#new dl {
	background: #eee;
    width: 90%;
    margin: 0 auto;
	padding: 20px;	
	border-radius: 4px;	
    font-size: 80%;
    line-height: 1.8;
}
/*日付設定*/
#new dt {
	float: left;
	width: 9em;	
	color: #e5831f;
	letter-spacing: 0.1em;
}
/*記事設定*/
#new dd {
	padding-left: 9em;
    margin-bottom: 10px;
}
/*---更新ページの更新情報-----------------------*/
.new2 {margin: auto;
    padding: 0px 4%;
}
.new2 dl {
	background: #eee;
    width: 100%;
	padding: 12px 14px;		
    font-size: 84%;
    margin-bottom: 12px;
    line-height: 1.8;
    text-align: justify; 
}
.new2 dt {
	float: left;
	width: 8em;	
	color: #e5831f;	
	letter-spacing: 0.1em;
    font-size: 84%;
}
.new2 dd {
	padding-left: 0em;
}

/*マークの設定各種　mark1は418行あたりに*/
.mark2 {width: 60px;height: auto;margin-top: -10px;margin-left:-50px;}
.mark3 {width: 30px;height: auto;margin-top: 0px;padding-right:5px;}
.mark4 {width: 35px;height: auto;margin-top: -5px;margin-right:8px;}
.mark5 {width: 33px;height: auto;margin-top: -2px;margin-right:0px;}


/*青い項目*/
.atama3 {
    color: #fff;
    background-color: #2688d4;
    padding: 4px 10px;
    border-radius: 4px;
    font-size: 90%;
    letter-spacing: 0.05em;
}  
.just2 {
    text-align: justify;
    font-size: 92%;
}

.atama4 {
    color: #fff;
    background-color: #2688d4;
    margin-right: 5px;
    padding: 3px 20px;
    border-radius: 10px;
    font-size: 80%;
    vertical-align: 0.05em;
}  

.color5 {
    color: #950191;
    font-weight: 800;
}

.orang {
	font-size: 94%;	
	color: #e5831f;	     
}

/*---ご利用ガイド--------------*/
/*oomidasiはfaqと共通*/
.oomidasi {
    clear: both;
    margin-bottom: 30px;	
    border-radius: 40px;
    border: 3px dotted #f16e0b;	
    padding: 15px 5% 10px;
}
.oomidasi h2 {
    font-size: 160%;
    text-align: center;
    line-height:  1.5;
}
.oomidasi h2 span {
	display: block;
	font-size: 66%;	
    line-height: 1.5;
	color: #e5831f;	
	letter-spacing: 0.2em;	
    margin-bottom: 10px; 
}
.oomidasi .lead {
    margin: 0px 0px 10px 0px;
    padding-top: 15px;
    border-top: 2px solid #5c5a5a;
}
.oomidasi .lead p {
    font-size: 88%;
    line-height: 1.7;
    text-align: justify;
}
.oomidasi2 {
    clear: both;
    width: 80%;
    margin: 0 10% 30px;	
    border-radius: 50px;
    border: 3px dotted #f16e0b;	
    padding: 10px 30px 10px 30px;
}
.oomidasi2 h2 {
    font-size: 170%;
    text-align: center;
    line-height:  1.7;
}
.oomidasi2 h2 span {
	display: block;
	font-size: 60%;	
	color: #e5831f;	
	letter-spacing: 0.2em;	 
}


/*教材のご購入のページ------------------------------*/
.dlshop #contents .main {
    float: left;
    width: 100%;
    padding: 0;
}    
.dlshop #contents .sub {
    display: none;
}
.oomidasi3 {
    width: 60%;
    height: auto;
    margin: 0 auto;	
    margin-bottom: 22px;
    border-radius: 20px;
    border: 3px dotted #f16e0b;	
    padding: 10px;
}
.oomidasi3 h2 {
    font-size: 145%;
    text-align: center;
    line-height:  1.4;
}
.oomidasi3 h2 span {
	display: block;
	font-size: 60%;	
	color: #e5831f;	
	letter-spacing: 0.2em;	 
}
.kounyuwrap {
    width : 70%;
    margin: auto;
    padding: 0px;
}
.kounyuwrap2 {
    padding: 20px 20% 0px;
    margin: 0 auto;
    border-top: 2px solid #F16E0B;
    font-size: 90%;
}
.kounyuwrap .honbun {
    font-size: 96%;
    line-height: 1.7;
    padding: 0px;
}
.kounyuwrap h4 {
    position: relative;
    left: 0;
    width: 95%;
    border-left: 10pt solid #f98600;
    font-size: 120%;
    border-bottom: 2px solid #f98600;
    margin-bottom: 20px;
    padding-left: 10px;
}
.kounyuwrap h5 {
    font-size: 100%;
    margin-top: 30px;
}

.atama6 {
    color: #fff;
    background-color: #2688d4;
    padding: 8px 10px;
    border-radius: 4px;
    font-size: 98%;
}

.kounyuwrap table {
    width: 100%;
    font-size: 80%;
}

/*ウクレレダウンロード版-----*/
.ta-dl1 {
    width: 96%;
    margin: 10px auto;
    background-color: #fff;    
}
.ta-dl1 td{
    padding: 14px;    
}
.ta-dl1 h3{
    font-size: 100%;
    color: #D56994;
    font-weight: bolder;
    margin-bottom: 13px;
}
.ta-dl1 p {
    font-size: 85%;
}
.teika {font-size: 90%;}
.lead-uk {
    margin: 0 auto 20px;
    padding: 2%;
}
.lead-uk p {font-size: 85%;}

.video {text-align: center;}
.video h5 {font-size: 90%;}   
.youtube {
    margin: 0 auto;
    width: 76%;
    height: auto; 
    padding: 10px;
}
.youtube iframe {
    max-width:500px; 
    min-height: 290px;
}    
/*その他
---------------------------------------------------------------------------*/
.look {background: #ccc;padding: 5px 10px;border-radius: 4px;}
.mb15,.mb1em {margin-bottom: 15px !important;}
.mb30 {margin-bottom: 30px !important;}
.mb50 {margin-bottom: 50px !important;}
.p0 {padding:0 !important;}
.clear {clear: both;}
ul.disc {padding: 0em 20px 40px 40px;list-style: disc;}

.color1, .color1 a {color: #e5831f !important;}
.color2 {color: #dd1a47;font-size: 110%;} /*赤く大きく*/
.color3 {color: #006400;font-weight: 800;}
.color4 {color: #dd1a47;font-size: 100%;font-weight: 700;}
.color6 {color: #dd1a47;font-size: 100%;padding: 0 1px;}

.pr {font-size: 10px;}
.wl {width: 96%;}
.ws {width: 50%;}
.c {text-align: center !important;}
.r {text-align: right !important;}
.l {text-align: left !important;}
.w50 {overflow: hidden;width: 50%;}

.fl {float: left;}
img.fl {float: left;width:30%; margin-right: 20px;margin-bottom: 20px;}
.fr {float: right;}
img.fr {float: right;width:30%;;margin-left: 20px;margin-bottom: 20px;}

.big1 {font-size: 40px;}
.mini1 {font-size: 11px;display: inline-block;line-height: 1.5;}
.sh {display: none;}


/*フッター設定
---------------------------------------------------------------------------*/
footer {
	clear: both;
	text-align: center;	
	font-size: 74%;	
	background: #D37577;
}
/*リンクテキスト------------------------*/
footer a {color: #fff;}
footer a:hover {color: #fff;}
/*---著作部分-----------------------*/
footer .pr {display: block;}

/*フッターメニュー
---------------------------------------------------------------------------*/
/*ボックス全体*/
.gainfoot {
    padding: 10px ;
    margin: auto;
    background: #EDEDED;
}
#footermenu {
	overflow: hidden;
	padding: 14px 11%;	
}
/*１行分の設定*/
#footermenu ul {
    display: flex;
    text-align: center;
}
#footermenu li {
    display: inline-block;
    float: left;
    width: 100%;   
}
/*class="title"とつけた場合の設定*/
#footermenu ul li.title a {
	font-weight: bold;
	opacity: 1;	/*色が100%出た状態にする。この指定がないと、下の0.7が適用される。*/
}
/*リンクテキストの設定*/
#footermenu a {
	text-decoration: none;
	opacity: 0.7;	/*透明度。70%の色がついた状態。*/
}
/*リンクのマウスオン時*/
#footermenu a:hover {
	opacity: 1;		/*透明度。100%の色がついた状態。*/
}

/*コピーライト
---------------------------------------------------------------------------*/
#copyright {
	clear: both;
	text-align: center;
	background: #333;
	color: #fff;
    padding: 10px;
}
#copyright a {text-decoration: none;}


/*inputボタンにclass="btn"をつけた場合の設定
---------------------------------------------------------------------------*/
#contents input[type="submit"].btn,
#contents input[type="button"].btn,
#contents input[type="reset"].btn {
	padding: 5px 10px;
	border: 1px solid #ccc;	
	font-size: 20px;		
	border-radius: 3px;	
	background: #eee;
}
/*マウスオン時の設定*/
#contents input[type="submit"].btn:hover,
#contents input[type="button"].btn:hover,
#contents input[type="reset"].btn:hover {
	border: 1px solid #999;	
	background: #fff;		
}

/*トップページのNEWアイコン
---------------------------------------------------------------------------*/
.newicon {
	background: #f00;
	color: #fff;
	font-size: 70%;	
	line-height: 1.5;
	padding: 2px 5px;
	border-radius: 2px;
	margin: 0px 5px;
	vertical-align: text-top;
}

/*ページの上部へボタン「↑」設定
---------------------------------------------------------------------------*/
@keyframes scroll {0% {opacity: 0;}100% {opacity: 1;}}
body .nav-fix-pos-pagetop a {display: none;}
body.is-fixed-pagetop .nav-fix-pos-pagetop a {
	display: block;
	text-decoration: none;
	text-align: center;
	width: 50px;
	line-height: 50px;
	z-index: 3;
	position: fixed;
	bottom: 20px;	/*下から20pxの場所に配置*/
	right: 3%;		/*右から3%の場所に配置*/
	background: #666;	/*背景色（古いブラウザ用）*/
	background: rgba(0,0,0,0.6);	/*背景色。0,0,0は黒の事。0.6は60%色がついた状態。*/
	color: #fff;
	border: 1px solid #fff;	
	animation-name: scroll;	/*上のアニメーションで指定しているkeyframesの名前（scroll）*/
	animation-duration: 1S;	/*アニメーションの実行時間*/
	animation-fill-mode: forwards;	/*アニメーションの完了後、最後のキーフレームを維持する*/
}
/*マウスオン時*/
body.is-fixed-pagetop .nav-fix-pos-pagetop a:hover {
	background: #999;
}




/*画面幅800px以下の設定
--------------------------------------------------------------*/
@media screen and (max-width:800px){

/*メニューブロック全体*/
#headermenu {
    display: none;}
/*ロゴ画像*/
header #logo img {
	width: 200px;	/*画像幅*/
	position: absolute;
	left: 3%;		/*ヘッダーに対して左から3%の場所に配置*/
	top: 16px;	/*ヘッダーに対して上からの場所*/   
}  
    
/*スマホ用メニューブロック---------------------*/
#menuword {display: none;}    
#menubar-s {
	display: block;
    overflow: hidden;
	position: absolute;
    z-index: 2;
	top: 2px;
    right: 1px;
	width: 360px;
	background: rgba(0,0,0,0.8);
	border-top: 1px solid #fff;
	animation-name: menubar;
	animation-duration: 0.5s;
	animation-fill-mode: both;
    padding: 50px 0px 20px;
}
/*メニュー１個あたりの設定*/
#menubar-s li a {
	display: block;
    text-decoration: none;
	padding: 5px 30px;
	border-bottom: 1px solid #fff;
	color: #fff;
	font-size: 14px;
}
li.current-s {background-color:#D37577;}     
#subsub li a {
    font-size: 13px;
    padding: 8px 30px;
}
      
 
#topdl  {
    max-width: 1000px;
    height: auto;	
} 
/*----３本バーブロック-------------*/
#menubar_hdr {
	display: block;
	position: absolute;z-index: 2;
	top: 15px;
	right: 4%;
	border: 1px solid #fff;	
}
/*----アイコン共通設定680----*/
#menubar_hdr.close,
#menubar_hdr.open {
	width: 46px;
	height: 49px;
}
/*----三本バーアイコン----*/
#menubar_hdr.close {
	background: rgba(148,133,119,0.60) url(../images/icon_menu.png) no-repeat center top/50px;	
}
/*----閉じるアイコン----*/
#menubar_hdr.open {
	background: rgba(148,133,119,0.60) url(../images/icon_menu.png) no-repeat center bottom/50px;
} 
/*----800-------*/    
.dlpointall {
    display: flex;
    flex-direction: column;
    font-size: 96%;
}
.dlpointall h3 {
    font-size: 120%;
    font-weight: 700;
    background-color: hsla(0,0%,100%,0.80);
    border-radius: 7px;
    padding-top: 5px;
    padding-right: 8px;
    padding-left: 8px;
    text-align: left;
    margin-bottom: 15px;    
}
.ptimg {
    width:52px;
    margin-bottom: 2px;
    }      
.pointimg {
    width: 60%;
    padding: 20px 0px 10px 0px;
}
.dlpoint1 {
    width:70%;
    padding: 20px;
    margin-left: 0;
}
.dlpoint2 {
    width:70%;
    padding: 20px;
    margin-left: 25%;
}    
.topnav {
    overflow: hidden;
    margin: 6vh 0 0;
    padding: 0 20px;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;   
} 
.topnav img{
    width: 130px;
    height: auto;
    margin: 10px 10px 15px;
}
.gainatesaki2 {
    margin: 0 auto;
    padding: 5px 8px;
    width: 250px;
    background-color: #FFF;
    border: 3px solid #D37577;
    font-size: 77%;
    border-radius: 9px;
}
.bigbutton {
    margin: 0px auto 10px;
    padding: 0;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    }
.bigbutton img {
    width: 188px;
    height: auto;
    margin: 5px 8px;
    }    
    
.listwrap {
    margin: 10px auto 20px;
    padding: 10px 0px;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
}
.mgroup {
    width: 47%;
    margin: 10px 7px;  
}
.mgroup h3 {
    font-size: 82%;
    margin-bottom: 4px;
} 
.mgroup h3 img {width: 20px;margin-top: -4px;}     
.slist {
    margin-bottom: 7px;
    padding: 4px 7px 4px 8px;
    background-color: #FFFFFF;
    border: 1px solid #B8B8B8;
    -webkit-box-shadow: 2px 2px rgba(118,118,118,0.78);
    box-shadow: 2px 2px rgba(118,118,118,0.78);
}


.m1 {
    display: flex;
    flex-direction: row;
    justify-content:space-between;
    font-size: 86%;
    padding: 0 5px;
}
.sz-m {font-size: 83%;padding-top: 2px;}
.m2 {display: flex;
    flex-direction: row;
    justify-content:space-between;
    font-size: 72%;
    padding: 0 5px;
    line-height: 1.3;
}
.sz-s {font-size: 84%;padding-top: 1px;padding-left: 4px}
    
.onp img {width:26px;margin-top: -6px;}
.onp {font-size: 80%;}
    
    
.dlfaq {
    margin: 20px auto;
    padding: 5px 15px 20px;
    background-color: #fff;
}
.dlfaq h3 {
    margin: 30px 5px 0px;
    font-size: 110%;
}
.dlfaq h3 img {
    height: 50px; 
} 
   
.maeoki {
    margin: 20px 4%;
    padding: 20px 18px 18px;
    font-size: 88%;
    line-height: 1.7;
    text-align: justify;
    border: 2px solid #D37577;
    background-color: #FFFFFF;
} 
.maeoki-in {
    position: absolute;
    top: 0;left: 0;
}
.maeoki-in img {width: 34px;padding: 4px 6px;}    

/*--曲リストのブロック--*/
.midasi {
    margin: 0 auto;
    padding: 10px 140px 5px;
    text-align: center;
    font-size: 76%;}    
.block2 {
    display: block;
    flex-direction: column;
    margin: -10px auto 30px;
    padding: 10px 5px;
} 

.ta22 {
    width: 96%;
    height: auto;
    margin: 10px auto 5px;
    padding: 8px;
    font-size: 90%;  
}
.ta22 td {line-height: 1.5;padding:5px;}
.song {font-size: 112%;}
.kana {font-size: 88%;}
    .price {font-size: 102%;}
.scart img {width: 86px;height: auto}    

/*---ガイド内の決済の表 800---------*/
#contents .main h2 {
    clear: both;
    margin: 15px auto 0px;
    padding: 3px;
    font-size: 120%;
    text-align: center;
    border: medium dotted #EF8081;
    background-color: #FFFFFF;
}
#contents h2 img {height:40px;width :auto;}
.dlguide {
    margin: 20px auto 40px ;
    padding: 20px 20px;
    background-color: #fff;   
}
.dlguide h3 {
    margin: 0 0 20px;
    font-weight: 500;
    font-size: 112%;
}
.storehyou {
    margin: 20px 5% 30px;
    display: flex;
    justify-content: center;
}
.tejun {
    margin: 20px auto 50px;
    padding: 0 3%;   
}
.tejun h5 {font-size: 95%;}    
.tejunzu {
    width: 100%;
    margin: auto;
    font-size: 85%; 
}    
.honbun {
    margin-bottom: 17px;
    padding: 0 3% 0;
    font-size: 90%;
    line-height: 1.8;
    text-align: justify;
}
.tdimg {
    width: 33%;
    height: auto;
}
.tdimg img {
    width: 80%;
}
.tdimg2 {width: 38%;height: auto;}
.tdimg2 img {width: 100%;height: auto;padding-bottom: 5px;}
.tdimg3 {width: 36%;height: auto;}
.tdimg3 img {width: 80%;height: auto;padding-bottom: 5px;}
    
/*「Q」と「A」のマーク共通設定800*/
.faq dt::before,
.faq dd::before {
	margin-right: 5px;display: inline-block;text-align: center;
	width: 24px;
	line-height: 24px;
}    

/*質問の設定*/
.faq dt {
	color: #000;
	padding-top: 18px;
	margin-bottom: 10px;
    font-size: 84%;
    text-align: justify;
}
/*回答の設定*/
.faq dd {
	border-bottom: 1px solid #ccc;
	overflow: hidden;
	padding-bottom: 13px;
    font-size: 84%;
    text-align: justify;
} 
.ta2, .ta2 td, .ta2 th {
	border: 1px solid #999;	/*テーブルの枠線の幅、線種、色*/
	line-height: 1.7;
    font-size: 90%;
	padding: 10px;	/*ボックス内の余白*/
} 
.polcy {margin: auto;padding: 0px 5px;line-height: 1.7;}
.polcy p {
    font-size: 86%;
    margin-bottom: 10px;
    text-align: justify;}
.polcy h5 {font-size: 93%;} 

.video {text-align: center;}
.video h5 {font-size: 90%;}
.videouk {text-align: center;}
.videouk h5 {font-size: 80%;}
.videouk video{width: 500px; height: auto;}    
.youtube {
    margin: 0 auto;
    width: 76%;
    height: auto; 
    padding: 10px;
}
.youtube iframe {
    max-width:500px; 
    min-height: 290px;
}       
    
}





/*画面幅680px以下の設定　　　
-------------------------------------------------------------------------*/
@media screen and (max-width:680px){
#topdl {
    max-width: 800px;
    height: auto;	
    } 

#topmini {
    display: none;
}
/*--Slickのドットの設定--*/
/*buttonタグ*/
ul.slick-dots li button {
	width: 10px;			/*ボタンの幅*/
	height: 10px;			/*ボタンの高さ*/	
} 
/*------*/ 
#contents {
	clear: both;
    overflow: hidden;
    position: relative;
	background: rgba(255,237,238,0.94);   /*元は#fff*/
	padding: 1% 3%;		/*上下、左右へのボックス内の余白*/
	margin: 0px 0% 22px;	/*上、左右、下へのボックスの外側への余白*/
} 
/*-----680--------*/    
.dlpointall {
    display: flex;
    flex-direction: column;
    font-size: 90%;
}
.dlpointall h3 {
    font-size: 120%;
    font-weight: 700;
    background-color: hsla(0,0%,100%,0.80);
    border-radius: 7px;
    padding-top: 5px;
    padding-right: 8px;
    padding-left: 8px;
    text-align: left;
    margin-bottom: 15px;    
}
.ptimg {
    width:50px;
    margin-bottom: 4px;
    }      
.pointimg {
    width: 80%;
    padding: 20px 0px 10px 0px;
}
.dlpoint1 {
    width:80%;
    padding: 20px;
    margin-left: 0;
}
.dlpoint2 {
    width:80%;
    padding: 20px;
    margin-left: 12%;
}    
.topnav {
    overflow: hidden;
    margin: 6vh 0 0;
    padding: 0 20px;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;   
} 
.topnav img{
    width: 125px;
    height: auto;
    margin: 10px 10px 15px;
}
.gainatesaki2 {
    margin: 0 auto;
    padding: 5px 8px;
    width: 250px;
    background-color: #FFF;
    border: 3px solid #D37577;
    font-size: 77%;
    border-radius: 9px;
}
.bigbutton {
    margin: 0 auto 10px;
    padding: 0px;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    }
.bigbutton img {
    max-width: 155px;
    height: auto;
    margin: 4px;
    }    
 
.kigou {
    margin: 0px 15% 5px;
    padding: 8px;
    font-size: 71%;
    text-align: center;
    border: 1px solid #FB8E91;
    line-height: 30px;  
}
.kigou img {height: 25px;}
.space p{font-size: 60%;}

.maeoki {
    margin: 20px 4%;
    padding: 16px 14px 16px;
    font-size: 87%;
    line-height: 1.7;
    text-align: justify;
    border: 2px solid #D37577;
    background-color: #FFFFFF;
} 
.maeoki-in {
    position: absolute;
    top: 0;left: 0;
}
.maeoki-in img {width: 30px;padding: 4px 6px;}    
.listwrap {
    margin: 0px auto 20px;
    padding: 10px 5px;
    display: block;
    flex-wrap:nowrap;
    justify-content: center;
}
.mgroup {
    width: 78%;
    margin: 0px auto 20px;  
}
.mgroup h3 {
    font-size: 90%;
    margin-bottom: 5px;
} 
.mgroup h3 img {width:20px;margin-top: -4px;}    
.slist {
    margin-bottom: 7px;
    padding: 4px 10px 4px 10px;
    background-color: #FFFFFF;
    border: 1px solid #B8B8B8;
    -webkit-box-shadow: 2px 2px rgba(118,118,118,0.78);
    box-shadow: 2px 2px rgba(118,118,118,0.78);
    }
.m1 {
    display: flex;
    flex-direction: row;
    justify-content:space-between;
    font-size: 87%;
    padding: 0 5px;
}
.sz-m {font-size: 84%;padding-top: 2px;}
.m2 {display: flex;
    flex-direction: row;
    justify-content:space-between;
    font-size: 78%;
    padding: 0 5px;
    line-height: 1.4;
}
.sz-s {font-size: 83%;padding-top: 2px;}
#footbox {
    clear: both;
    margin: 0 auto;
    padding: 10px 0px;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    }   
/*許諾スペース*/
.kyodaku {
    width: 270px;
    padding: 10px 10px 0px 0px;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-around;
}
.kyodaku img {width: 84px;}
.kyodaku p {
    font-size: 65%;line-height: 1.4;padding-top: 5px;
}
.mschol {
    width: 160px;
    height: auto;
    padding: 13px 0px 10px 10px;  
}
    

    
/*---ガイド内の決済の表680---------*/

#contents .main h2 {
    clear: both;
    margin: 15px auto 0px;
    padding: 5px;
    font-size: 110%;
    text-align: center;
    border: medium dotted #EF8081;
    background-color: #FFFFFF;
}
#contents h2 img {height:36px;width :auto;}    
.dlguide {
    margin: 10px auto 40px ;
    padding: 14px 3%;
    background-color: #fff;   
}
.dlguide h3 {
    margin: 0 0 20px;
    font-weight: 500;
    font-size: 103%;
}

.storehyou {
    margin: 0px auto 40px;
    padding: 0 1%;
    display: flex;
    justify-content: center;
    font-size: 88%;
}
.honbun {
    margin-bottom: 17px;
    padding: 0 6px 0;
    font-size: 86%;
    line-height: 1.8;
    text-align: justify;
}    
.tejun {
    margin: 0px 3px 50px;
    padding: 0px;   
}
.tejunzu {
    width: 100%;
    margin: auto;
    font-size: 80%;   
}
.tejun h5 {font-size: 90%;}    

.tdimg {
    width: 33%;
    height: auto;
}
.tdimg img {
    width: 83%;
}
.tdimg2 {width: 38%;height: auto;}
.tdimg2 img {width: 100%;height: auto;padding-bottom: 5px;}
.tdimg3 {width: 32%;height: auto;}
.tdimg3 img {width: 88%;height: auto;padding-bottom: 5px;}
    
/*質問ページ　680---------------------------*/

.dlfaq {
    margin: 20px auto;
    padding: 5px 5px;
    background-color: #fff;
}
.dlfaq h3 {
    margin: 15px 5px 0px;
    font-size: 105%;
}
.dlfaq h3 img {
    height: 45px; 
}
.faq {
    margin: 0 0 10px;
	padding: 2px 10px;
}
/*「Q」と「A」のマーク共通設定680*/
.faq dt::before,
.faq dd::before {
	margin-right: 5px;display: inline-block;text-align: center;
	width: 23px;
	line-height: 23px;
}    

/*質問の設定*/
.faq dt {
	color: #000;
	padding-top: 18px;
	margin-bottom: 9px;
    font-size: 82%;
    text-align: justify;
}
/*回答の設定*/
.faq dd {
	border-bottom: 1px solid #ccc;
	overflow: hidden;
	padding-bottom: 13px;
    font-size: 82%;
    text-align: justify;
}    
    
    
    
/*メニューブロック全体*/
#headermenu {
    display: none;}
/*ロゴ画像*/
header #logo img {
	width: 200px;	/*画像幅*/
	position: absolute;
	left: 3%;		/*ヘッダーに対して左から3%の場所に配置*/
	top: 16px;	/*ヘッダーに対して上からの場所*/   
}    
    
.topshort {display: none;}
.topshort2 {
    display: block;
    }
.gainatesaki {
    padding: 5px 10px;
    margin: 20px auto 0px;
    max-width: 330px;
    max-height: 100px;
    background-color: #FFF;
    border: 3px solid #D37577;
    font-size: 78%;
    border-radius: 9px;
} 
.gainatesaki3 {
    padding: 5px 10px;
    margin: 0px auto 5px;
    max-width: 330px;
    max-height: 100px;
    background-color: #FFF;
    border: 3px solid #D37577;
    font-size: 78%;
    border-radius: 9px;
}      
    
/*--曲リストのブロック680--*/
.midasi {
    margin: 10px auto 0px;
    padding: 5px 50px 5px;
    text-align: center;
    font-size: 74%;}    
.block2 {
    display: block;
    flex-direction: column;
    margin: -10px auto 30px;
    padding: 10px 0px;
} 

.ta22 {
    width: 96%;
    height: auto;
    margin: 10px auto 5px;
    padding: 8px;
    font-size: 88%;  
}
.ta22 td {line-height: 1.5;padding:4px;}
.song {font-size: 112%;}
.kana {font-size: 90%;}
.scart img {width:80px;height: auto;}    
    
    

#formstyle #contents .main {
    width: 94%;
    margin: auto;
}    


/*---サブメニューは下に2ブロック　680----------*/    
#contents .sub {
	float: none;
    width: auto;
    padding: 20px 1%;
}
.subw1 {
    display: flex;
    justify-content: center;
} 
.subgrp {
    margin: 0 2% 20px ;   
}    
.sub .box1,
.sub .box2,
.sub .box3,
.sub .box4 {width: 220px;
}
.sub .box5 {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
}    
.sub .banner-s {
    width: 200px;
    margin: 2px 3%;
 } 

/*------マークの設定各種680--------*/
.mark2 {width: 60px;height: auto;margin-top: -10px;margin-left:-50px;}
.mark3 {width: 30px;height: auto;margin-top: 0px;padding-right:5px;}
.mark4 {width: 30px;height: auto;margin-top: -5px;margin-right:8px;}
.mark5 {width: 30px;height: auto;margin-top: -2px;margin-right:0px;}    
/*スマホ用メニューブロック680---------------------*/
#menubar-s {
	display: block;overflow: hidden;
	position: absolute;z-index: 2;
	top: 2px;right:1px;
	width: 360px;
	background: rgba(0,0,0,0.8);
	border-top: 1px solid #fff;
	animation-name: menubar;
	animation-duration: 0.5s;
	animation-fill-mode: both;
}
/*メニュー１個あたりの設定*/
#menubar-s li a {
	display: block;text-decoration: none;
	padding: 8px 30px;
	border-bottom: 1px solid #fff;
	color: #fff;
	font-size: 14px;
}
li.current-s {background-color:#D37577;}     
#subsub li a{
    font-size: 13px;
    padding: 8px 30px;
}
   

/*---PC用メニューを非表示にする680---*/
#menubar {display: none;}

/*----３本バーアイコン設定
---------------------------------------------------------------------------*/
/*----３本バーブロック-------------*/
#menubar_hdr {
	display: block;
	position: absolute;z-index: 2;
	top: 14px;
	right: 4%;
	border: 1px solid #fff;	
}
/*----アイコン共通設定680----*/
#menubar_hdr.close,
#menubar_hdr.open {
	width: 46px;
	height: 49px;
}
/*----三本バーアイコン----*/
#menubar_hdr.close {
	background: rgba(148,133,119,0.60) url(../images/icon_menu.png) no-repeat center top/50px;	
}
/*----閉じるアイコン----*/
#menubar_hdr.open {
	background: rgba(148,133,119,0.60) url(../images/icon_menu.png) no-repeat center bottom/50px;
}    
       
/*----トップページ　680----*/
 
.kounyuwrap table {
    width: 94%;
    font-size: 75%;
}    
.cartgroup2 {
    width : 300px;
    height: auto;
    margin: auto;
    margin-top: 0px;
    margin-bottom: 20px;
    background-color: #fff;
    border: 2px dotted #1647a8;
    }
.cartgroup2 h6 {
    font-size: 84%;
    text-align: center;
    margin: 10px 0 ;
}
.cartgroup2 .cart img{
    width:55%;
    height: auto;
    margin-bottom: 18px;
}
.ta2, .ta2 td, .ta2 th {
	border: 1px solid #999;	/*テーブルの枠線の幅、線種、色*/
	line-height: 1.7;
    font-size: 88%;
	padding: 10px;	/*ボックス内の余白*/
    } 

.video {
    text-align: center;
 }
.videouk {text-align: center;}
.videouk h5 {font-size: 80%;}
.videouk video{width: 448px; height: auto;}    
.youtube {
    margin: 5px 10% 0px;
    width: 80%;
    height: auto; 
    padding: 0px;
}
.youtube iframe {
    max-width:440px; 
    min-height: 248px;
}    
    

}


/*画面幅550px以下の設定
------------------------------------------------------------------------------------------------------------------------------------------------------*/
@media screen and (max-width:550px){
#topdl  {
    display: none;
} 
#topmini {
    display: block;
    max-width: 600px;
    height: auto;	
}
/*----550----*/    
.dlpointall {
    display: flex;
    flex-direction: column;
    font-size: 88%;
}
.dlpointall h3 {
    font-size: 115%;
    font-weight: 700;
    background-color: hsla(0,0%,100%,0.80);
    border-radius: 7px;
    padding-top: 5px;
    padding-right: 8px;
    padding-left: 8px;
    text-align: left;
    margin-bottom: 15px;    
}
.ptimg {
    width:48px;
    margin-bottom: 2px;
    }      
.pointimg {
    width: 90%;
    padding: 20px;
}
.dlpoint1 {
    width:100%;
    padding: 0px;
    margin-left: 0;
    margin-bottom: 50px;
}
.dlpoint2 {
    width:100%;
    padding: 0px;
    margin-left: 0%;
    margin-bottom: 50px;
}    
    
.topnav {
    overflow: hidden;
    margin: 5vh 0 0;
    padding: 0 20px;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;   
} 
.topnav img{
    width: 115px;
    height: auto;
    margin: 10px 4px 15px;
}
.gainatesaki2 {
    margin: 0 auto;
    padding: 5px 8px;
    width: 240px;
    background-color: #FFF;
    border: 3px solid #D37577;
    font-size: 72%;
    border-radius: 9px;
} 
.kigou {
    margin: 0px 10% 20px;
    padding: 7px;
    font-size: 70%;
    text-align: center;
    border: 1px solid #FB8E91;
    line-height: 28px;  
}
.kigou img {height: 25px;}
.space p{font-size: 50%;}
.maeoki {
    margin: 20px 4%;
    padding: 18px 10px 15px;
    font-size: 86%;
    line-height: 1.7;
    text-align: justify;
    border: 2px solid #D37577;
    background-color: #FFFFFF;
    } 
.maeoki-in {
    position: absolute;
    top: 0;left: 0;
}
.maeoki-in img {width: 29px;padding: 4px 6px;}    
.listwrap {
    margin: 10px auto;
    padding: 0px;
    display: flex;
    flex-direction:column;
}
.mgroup {
    width: 90%;
    margin: 0px auto 20px;   
}
.mgroup h3 {
    font-size: 85%;
    margin-bottom: 5px;
}
    
    
.slist {
    margin-bottom: 7px;
    padding: 4px 10px 4px 10px;
    background-color: #FFFFFF;
    border: 1px solid #B8B8B8;
    -webkit-box-shadow: 2px 2px rgba(118,118,118,0.78);
    box-shadow: 2px 2px rgba(118,118,118,0.78);
}

.bigbutton {
    margin: 0 auto 10px;
    padding: 0 10px;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    }
.bigbutton img {
    max-width: 160px;
    height: auto;
    margin: 4px 8px;
    } 

#footbox {
    clear: both;
    margin: 0 auto;
    padding: 10px 0px;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    }   
/*許諾スペース*/
.kyodaku {
    width: 230px;
    padding: 0px;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-around;
}
.kyodaku img {width: 70px;}
.kyodaku p {
    font-size: 55%;
}
.mschol {
    width: 140px;
    height: auto;
    padding: 1px 0px 10px 5px;  
}    
/*---ガイド内の決済の表550---------*/
#contents .main h2 {
    clear: both;
    margin: 10px auto 0px;
    padding: 3px;
    font-size: 102%;
    text-align: center;
    border: medium dotted #EF8081;
    background-color: #FFFFFF;
}
#contents h2 img {height:34px;width :auto;}
.dlguide {
    margin: 0px auto 30px ;
    padding: 14px 3%;
    background-color: #fff;   
}
.dlguide h3 {
    margin: 0px auto 10px;
    font-weight: 500;
    font-size: 100%;
}
.storehyou {
    margin: 0 0 50px;
    display: flex;
    justify-content: center;
    font-size: 76%
}
.honbun {
    margin-bottom: 20px;
    font-size: 80%;
    line-height: 1.7;
    text-align: justify;
}    
.tejun {
    margin: 10px auto 40px;
    padding: 0;   
}
.tejunzu {
    width: 100%;
    margin: auto;
    font-size: 76%;
}
.tejun h5 {font-size: 80%;}    

.tdimg {
    width: 33%;
    height: auto;
}
.tdimg img {
    width: 92%;
} 
.tdimg2 {width: 38%;height: auto;}
.tdimg2 img {width: 100%;height: auto;padding-bottom: 5px;}
.tdimg3 {width: 32%;height: auto;}
.tdimg3 img {width: 88%;height: auto;padding-bottom: 5px;}
    
/*--曲リストのブロック550--*/
.midasi {
    margin: 10px auto 20px;
    padding: 0px 30px;
    text-align: center;
    font-size: 66%;}    
.block2 {
    display: block;
    flex-direction: column;
    margin: -20px 0 20px;
    padding: 4px 0px;
} 

.ta22 {
    width: 97%;
    height: auto;
    margin: 10px 0px 5px 0px;
    padding: 7px;
    font-size: 84%;  
}
.ta22 td {line-height: 1.5;padding: 4px;}
.song {font-size: 120%;}
.kana {font-size: 90%;}
.scart img {width:78px;height: auto;} 
    
/*「Q」と「A」のマーク共通設定*/
.faq dt::before,
.faq dd::before {
	margin-right: 5px;display: inline-block;text-align: center;
	width: 23px;
	line-height: 23px;
}    

/*質問の設定*/
.faq dt {
	color: #000;
	padding-top: 18px;
	margin-bottom: 7px;
    font-size: 81%;
    text-align: justify;
}
/*回答の設定*/
.faq dd {
	border-bottom: 1px solid #ccc;
	overflow: hidden;
	padding-bottom: 13px;
    font-size: 81%;
    text-align: justify;
    line-height: 1.7;
}
.ta2, .ta2 td, .ta2 th {
	border: 1px solid #999;	/*テーブルの枠線の幅、線種、色*/
	line-height: 1.6;
    font-size: 87%;
	padding: 10px;	/*ボックス内の余白*/
    } 
.polcy {margin: auto;padding: 0px 5px;}
.polcy p {
    font-size: 84%;
    margin-bottom: 10px;
    text-align: justify;}
.polcy h5 {font-size: 90%;} 
    
.video {text-align: center;}
.video h5 {font-size: 80%;}
.videouk {text-align: center;}
.videouk h5 {font-size: 80%;}
.videouk video{width: 90%; height: auto;}    
.youtube {
    margin: 0 auto;
    width: 90%;
    height: auto; 
    padding: 5px;
}
.youtube iframe {
    max-width:400px; 
    min-height: 225px;
}      
    
}
/*画面幅420px以下の設定
------------------------------------------------------------------------------------------------------------------------------------------------------*/
@media screen and (max-width:420px){

/*全体の設定
--------------------------------------------------------------------*/
body {font-size: 14px;}	
/*main,subコンテンツ　420-----------------------------------------------*/
#formstyle #contents .main {
    width: 94%;
    margin: auto;
}
#topdl  {
    display: none;
} 
#topmini {
    display: block;
    max-width: 500px;
} 
/*--Slickのドットの設定--*/
/*buttonタグ*/
ul.slick-dots li button {
	width: 8px;			/*ボタンの幅*/
	height: 8px;			/*ボタンの高さ*/	
} 
/*---420---*/
.dlpointall {
    display: flex;
    flex-direction: column;
    font-size: 100%;
    padding: 10px;
}
.dlpointall h3 {
    font-size: 115%;
    font-weight: 700;
    background-color: hsla(0,0%,100%,0.80);
    border-radius: 7px;
    padding-top: 5px;
    padding-right: 8px;
    padding-left: 8px;
    text-align: left;
    margin-bottom: 15px;    
}
.ptimg {
    width:40px;
    margin-bottom: 2px;
    }    
.pointimg {
    width: 90%;
    padding: 20px;
}
.dlpoint1 {
    width:100%;
    padding: 0px;
    margin-left: 0;
    margin-bottom: 50px;
}
.dlpoint2 {
    width:100%;
    padding: 0px;
    margin-left: 0%;
    margin-bottom: 50px;
}       
    
.topnav {
    overflow: hidden;
    margin: 6vh 0 0;
    padding: 0 10px;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;   
} 
.topnav img{
    max-width: 100px;
    height: auto;
    margin: 0px 5px 5px;
}
.gainatesaki2 {
    margin: 10px auto 0px;
    padding: 5px 8px;
    max-width: 210px;
    background-color: #FFF;
    border: 3px solid #D37577;
    font-size: 82%;
    border-radius: 9px;
}
.bigbutton {
    margin: 0 auto 10px;
    padding: 0px;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    }
.bigbutton img {
    max-width: 150px;
    height: auto;
    margin: 4px 5px;
    }        
 
.kigou {
    margin: 0px 10px 5px;
    padding: 5px;
    font-size: 73%;
    text-align: center;
    border: 1px solid #FB8E91;
    line-height: 28px;  
}
.kigou img {height: 25px;}
.space p{font-size: 30%;}
.maeoki {
    margin: 20px 3% 10px;
    padding: 17px 10px 14px;
    font-size: 98%;
    line-height: 1.7;
    text-align: justify;
    border: 2px solid #D37577;
    background-color: #FFFFFF;
    } 
.maeoki-in {
    position: absolute;
    top: 0;left: 0;
}
.maeoki-in img {width: 29px;padding: 4px 6px;}    
.listwrap {
    margin: 10px auto;
    padding: 0px;
    display: flex;
    flex-direction:column;
}
.mgroup {
    width: 95%;
    margin: 0px auto 20px;   
}
.mgroup h3 {
    font-size: 110%;
    margin-bottom: 5px;
}
    
    
.slist {
    margin-bottom: 7px;
    padding: 4px 10px 4px 10px;
    background-color: #FFFFFF;
    border: 1px solid #B8B8B8;
    -webkit-box-shadow: 2px 2px rgba(118,118,118,0.78);
    box-shadow: 2px 2px rgba(118,118,118,0.78);
}
.m1 {
    display: flex;
    flex-direction: row;
    justify-content:space-between;
    font-size: 100%;
    padding: 0 5px;
}
.sz-m {font-size: 90%;padding-top: 2px;}
.m2 {display: flex;
    flex-direction: row;
    justify-content:space-between;
    font-size: 88%;
    padding: 0 5px;
    line-height: 1.4;
}
.sz-s {font-size: 88%;padding-top: 2px;}
.gainatesaki {
    padding: 5px 10px;
    margin: 20px auto 0px;
    max-width: 290px;
    max-height: 100px;
    background-color: #FFF;
    border: 3px solid #D37577;
    font-size: 90%;
    line-height: 190%;
    border-radius: 9px;
} 
.gainatesaki3 {
    padding: 5px 10px;
    margin: 0px auto 0px;
    max-width: 290px;
    max-height: 100px;
    background-color: #FFF;
    border: 3px solid #D37577;
    font-size: 90%;
    line-height: 190%;
    border-radius: 9px;
}            
     
/*--曲リストのブロック420--*/
.midasi {
    margin: 14px auto 20px;
    padding: 0px 10px;
    text-align: center;
    font-size: 78%;}    
.block2 {
    display: block;
    flex-direction: column;
    margin: -20px 0 20px;
    padding: 4px 0px;
} 

.ta22 {
    width: 97%;
    height: auto;
    margin: 10px 0px 5px 0px;
    padding: 6px;
    font-size: 108%;  
}
.ta22 td {line-height: 1.4;padding: 4px;}
.song {font-size: 114%;}
.kana {font-size: 90%;}
.scart img {width: 75px;height: auto;}
    
#footbox {
    clear: both;
    margin: 0 auto;
    padding: 10px 0px;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    }   
/*許諾スペース*/
.kyodaku {
    width: 280px;
    padding: 10px 10px 0px 10px;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-around;
}
.kyodaku img {width: 70px;margin-bottom: 4px;}
.kyodaku p {
    font-size: 65%;line-height: 1.3;
}
.mschol {
    width: 200px;
    height: auto;
    padding: 16px 0px 0px 0px;  
}
    
/*---ガイド内の決済の表---------*/
#contents .main h2 {
    clear: both;
    margin: 10px auto 10px;
    padding: 2px;
    font-size: 114%;
    text-align: center;
    border: medium dotted #EF8081;
    background-color: #FFFFFF;
}
#contents h2 img {height:31px;width :auto;}
.dlguide {
    margin: 0px auto 30px ;
    padding: 12px 3%;
    background-color: #fff;   
}
.dlguide h3 {
    margin: 0 auto 10px;
    font-weight: 500;
    font-size: 122%;
}
.storehyou {
    margin: 0 0 50px;
    display: flex;
    justify-content: center;
    font-size: 90%
}
.honbun {
    margin-bottom: 16px;
    font-size: 100%;
    line-height: 1.7;
    text-align: justify;
}    
.tejun {
    margin: 0px auto 50px;
    padding: 0px;   
}
.tejun h5 {font-size: 100%;}
.tejunzu {
    width: 100%;
    margin: auto;
    font-size: 89%;
}
.tdimg {
    width: 33%;
    height: auto;
}
.tdimg img {
    width: 88%;
} 
.tdimg2 {width: 38%;height: auto;}
.tdimg2 img {width: 100%;height: auto;padding-bottom: 5px;}
.tdimg3 {width: 32%;height: auto;}
.tdimg3 img {width: 95%;height: auto;padding-bottom: 5px;}
    
/*質問ページ　---------------------------*/

.dlfaq {
    margin: 20px auto;
    padding: 5px 5px 8px;
    background-color: #fff;
}
.dlfaq h3 {
    margin: 15px 0px 0px;
    font-size: 110%;
}
.dlfaq h3 img {
    height: 40px; 
}
/*「Q」と「A」のマーク共通設定*/
.faq dt::before,
.faq dd::before {
	margin-right: 5px;display: inline-block;text-align: center;
	width: 20px;
	line-height: 20px;
}         
.faq {
    margin: 0 0 10px;
	padding: 2px 6px;
}
/*質問の設定*/
.faq dt {
	color: #000;
	padding-top: 15px;
	margin-bottom: 8px;
    font-size: 95%;
    text-align: justify;
}
/*回答の設定*/
.faq dd {
	border-bottom: 1px solid #ccc;
	overflow: hidden;
	padding-bottom: 13px;
    font-size: 95%;
    text-align: justify;
}    
    

/*サブコンテンツのh2タグ*/
#contents .sub h2 {
	font-size: 108%;
    line-height: 20px;
	margin-bottom: 6px;
	text-align: left;
}
#contents .sub h2::first-letter {
	padding-left: 15px;	
    border-left: 5px solid #fff;
}
#contents .sub p {
	padding: 0;
	font-size: 90%;
}
#contents .sub section + section {
	margin-top: 5px;
}    
#contents .sub {
	float: none;
    width: auto;
    padding: 20px 1%;
}
.subw1 {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
} 
.subw2 .box5{
    display: none;
}     
.subgrp {
    margin: 0 1% 10px;   
}    
.sub .box1,
.sub .box2,
.sub .box3,
.sub .box4 {
     width: 260px;
 }
.sub .box5 {
    margin:  5px 1% 10px;
    padding: 5px 5%;
}    
.sub .banner-s {
    width: 230px;
    height: auto;
    margin: 0 0 5px;
 } 
.sub .box1 li {font-size: 86%;padding-left: 10px;} 
.sub .box2 li {font-size: 86%;padding-left: 10px;} 
.sub .box3 li {font-size: 86%;padding-left: 10px;}
.sub .box4 li {font-size: 86%;padding-left: 10px;}    
/*---スマホ用メニューブロック 420---------------------*/
#menubar-s {
	display: block;
    overflow: hidden;
	position: absolute;
    z-index: 2;
	top: 2px;right: 1px;
	width: 300px;
	background: rgba(0,0,0,0.8);
	border-top: 1px solid #fff;
	animation-name: menubar;
	animation-duration: 0.5s;
	animation-fill-mode: both;
}
/*---メニュー１個あたりの設定---*/
#menubar-s li a {
	display: block;
    text-decoration: none;
	padding: 8px 25px 8px 20px;
	border-bottom: 1px solid #fff;
	color: #fff;
	font-size: 13px;
}
li.current-s {background-color:#D37577;}     
#subsub li a{
    font-size: 12px;
    padding: 8px 20px 8px 30px;
}
   

/*---PC用メニューを非表示にする　420---*/
#menubar {display: none;}

/*---３本バーアイコン---設定
---------------------------------------------------------------------------*/
/*---３本バーブロック---*/
#menubar_hdr {
	display: block;
	position: absolute;z-index: 2;
	top: 14px;
	right: 4%;
	border: 1px solid #fff;
}
/*---アイコン共通設定---*/
#menubar_hdr.close,
#menubar_hdr.open {
	width: 44px;
	height: 49px;
}
/*---三本バーアイコン---*/
#menubar_hdr.close {
	background: rgba(148,133,119,0.60) url(../images/icon_menu.png) no-repeat center top/50px;
}
/*---閉じるアイコン---*/
#menubar_hdr.open {
	background: rgba(148,133,119,0.60) url(../images/icon_menu.png) no-repeat center bottom/50px;
}    
/*---写真の上の飾り---*/
.kei {
    padding: 0 1% 10px;
}    
.message1 {
    padding: 0px 0%;
    text-align: center;
    font-size: 88%;
}
.pop {
  margin: auto;
  padding: 0 3% 15px;    
}    
/*マークの設定各種*/
.mark2 {width: 60px;height: auto;margin-top: -10px;margin-left:-50px;}
.mark3 {width: 30px;height: auto;margin-top: 0px;padding-right:5px;}
.mark4 {width: 22px;height: auto;margin-top: -5px;margin-right:8px;}
.mark5 {width: 25px;height: auto;margin-top: -2px;margin-right:1px;}    
    


/*ヘッダー　420---------------------------------------------------*/
/*----ヘッダーブロック----*/
header {
	position: static;
	height: auto;
}
/*----ロゴ画像----*/
header #logo img {
	width: 160px;
	position: static;
	padding: 20px 3%;
}

/*ヘッダー内メニュー-----------------------------------------------*/
#headermenu {
    display: none;}

/*-----btn1　420-------------*/
#contents a.btn1 {
	padding: 0px 10px;
}

/*inputボタンにclass="btn"をつけた場合の設定
--------------------------------------------------------------------*/
#contents input[type="submit"].btn,
#contents input[type="button"].btn,
#contents input[type="reset"].btn {
	font-size: 12px;
}
    




/*---トップページの更新情報ブロック420-----*/
#new dl {
	background: #eee;
    width: 94%;
    margin: 0 auto;
	padding: 18px;
	border-radius: 4px;
    font-size: 92%;
    text-align: justify;
    line-height: 1.9;
}
/*----日付設定----*/
#new dt {
	float: left;
	width: 8em;
	color: #e5831f;
}
/*------記事設定--------*/
#new dd {
	padding-left: 0em;
}
/*---更新ページの更新情報420----------------------*/
.new2 {margin: auto;
    padding: 0px 4%;
}
.new2 dl {
	background: #eee;
    width: 98%;
	margin: 0 auto;
	padding: 18px;		
    font-size: 92%;
    margin-bottom: 10px;
    line-height: 2.0;
    text-align: justify; 
}
.new2 dt {
	float: left;
	width: 8em;	
	color: #e5831f;	
	letter-spacing: 0.1em;
    font-size: 92%;
}
.new2 dd {
	padding-left: 0em;
}     
    
.ta2, .ta2 td, .ta2 th {
	border: 1px solid #999;	/*テーブルの枠線の幅、線種、色*/
	line-height: 1.6;
    font-size: 92%;
	padding: 10px;	/*ボックス内の余白*/
    } 
.polcy {margin: auto;padding: 0px 6px;line-height: 1.6;}
.polcy p {
    font-size: 94%;
    margin-bottom: 10px;
    text-align: justify;}
.polcy h5 {font-size: 99%;}

.video {text-align: center;}
.video h5 {font-size: 88%;}   
.youtube {
    margin: auto;
    width: 92%;
    height: auto; 
    padding: 5px 1%;
}
.youtube iframe {
    max-width:360px; 
    height: auto;
}       

    
/*---その他　　420------------------------------------------------------*/
.ws,.wl {width: 94%;}
.big1 {font-size: 16px;}
img.fl {margin-right: 5px;margin-bottom: 5px;}
img.fr {margin-left: 5px;margin-bottom: 5px;}
ul.disc {padding: 0em 0px 20px 18px;}
.color1, .color1 a {color: #e5831f !important;}
.color2 {color: #dd1a47;font-size: 100%;}
.color3 {color: #006400;font-weight: 800;}
.color4 {color: #dd1a47;font-size: 100%;font-weight: 700;} 
.tel {color: #000;text-decoration: none;}    
}