html, body, div, span, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
abbr, address, cite, code,
del, dfn, em, img, ins, kbd, q, samp,
small, strong, sub, sup, var,
b, i,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, figcaption, figure,
footer, header, hgroup, menu, nav, section, summary,
time, mark, audio, video{
	margin:0;
    padding:0;
    border:0;
    outline:0;
    font-size:100%;
    vertical-align:baseline;
    background:transparent;
}
*{
	margin:0px;
	padding:0px;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	-o-box-sizing: border-box;
	-ms-box-sizing: border-box;
	box-sizing: border-box;
}
h1,h2,h3,h4,h5,h6{
	font-weight:normal;
	font-size:100%;
}

a {
    margin:0;
    padding:0;
    color: #089dd4;
    font-size:100%;
    vertical-align:baseline;
    background:transparent;
}

a:hover {
    color:#5B6D44;
}

img{
	border:0px;
	vertical-align:top;
}
ol, ul{
    list-style:none;
}
caption, th{
    text-align: left;
}
blockquote, q {
	quotes: none;
}

blockquote:before, blockquote:after,
q:before, q:after {
	content: '';
	content: none;
}
article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section {
	display: block;
}
html{
    overflow-y: scroll;
}



/*smartphone*/
/*------------------------------------------------------------------------------*/

html { -webkit-text-size-adjust: none; }
a { -webkit-tap-highlight-color: rgba(0,0,0,0.3);}


/*base*/
/*------------------------------------------------------------------------------*/
body{
	font-family: "Sawarabi Mincho", sans-serif;
	font-style: normal;
	font-weight: 100;
	color:#333;
	font-weight:normal;
	font-size: 100%;
	line-height:1.7;
	word-break:break-all;
	background: url(../images/body_bg.jpg);
}

p { font-size: 140%; }

a{
	text-decoration: underline;
	color: #009245;
}
a:hover { opacity: 0.7; text-decoration: underline; }
a:hover img{
	opacity: 0.7;
}

.clear{clear:both;}
.clearfix:after  {
	content: "";
	display: block;
	height: 0;
	clear: both;
	visibility: hidden;
}
.clearfix {
	min-height: 1px;
}
section:after  {
	content: "";
	display: block;
	height: 0;
	clear: both;
	visibility: hidden;
}

.FloatLeft { float: left; }
.FloatRight { float: right; }

/* 一パイプオルガンスタジオ・吉祥寺 */
#wrapper { margin: 0; width: 100%;  }
.container { width: 1240px; margin: 0 auto; }
header {  }
.container h1 { width: 100%;  }
.container h1 img { width: 100%; }
.container h2 { text-align: center; color: #603813; font-size: 140%; padding: 2em 0; letter-spacing: 0.4em; font-weight: 100; margin-bottom: 40px; }

.container .content_profile {  }
.container .content_profile h3 { width: 10%; float: left; }
.container .content_profile h3 img { filter: drop-shadow(5px 5px 5px #808080); }
.container .content_profile .profile_text { width: 66%; float: left; font-size: 100%; letter-spacing: 0.4em; }
.container .content_profile .profile_text a { display: block; font-size: 90%; letter-spacing: 0.1em; text-align: right; }
.container .content_profile .profile_photo { width: 280px; float: right; }
.container .image_photo { padding: 6em 0; }

.container .content_class {  }
.container .content_class h3 { width: 10%; float: left; }
.container .content_class h3 img { filter: drop-shadow(5px 5px 5px #808080); }
.container .content_class .class_content { width: 45%; float: left; font-size: 100%; letter-spacing: 0.4em; }
.container .content_class .class_content2 { width: 45%; float: right; font-size: 100%; letter-spacing: 0.4em; text-align: right; padding-right: 0.6em; }
.container .content_class .class_content img { filter: drop-shadow(5px 5px 5px #808080); }
.container .content_class .class_content2 img { filter: drop-shadow(5px 5px 5px #808080); }
.class_caution { padding-left: 10%; font-size: 90%; letter-spacing: 0.16em; padding-bottom: 6em; }

.content_inquiry { margin-left: 10%; padding: 1em 0 2em; background: #ffffff; border-radius: 10px; text-align: center; filter: drop-shadow(5px 5px 5px #808080);  margin-right: 0.6em; margin-bottom: 0.6em; }
.content_inquiry h3 { font-size: 140%; letter-spacing: 0.1em; color: #603813; }
.content_inquiry .inquiry_phone { background: url(../images/inquiry_icon01.svg) no-repeat left center; text-align: left; width: 52%; padding: 0.3em 0 0.3em 2.4em; margin: 0 auto; font-size: 150%; letter-spacing: 0.2em; }
.content_inquiry .inquiry_mail { background: url(../images/inquiry_icon02.svg) no-repeat left center; text-align: left; width: 52%; padding: 0.3em 0 0.3em 2.4em; margin: 0 auto; font-size: 150%; letter-spacing: 0.2em; }

footer { background: #42210b; color: #ffffff; margin-top: 8em; font-size: 60%; font-family:'メイリオ', 'Meiryo', sans-serif; letter-spacing: 0.1em; padding: 1.5em 0; }
footer a { color: #ffffff; }
footer .footer_left { width: 40%; float: left; }
footer .footer_right { width: 40%; float: right; }

.sp_none { display: block; }
.pc_none { display: none; }

.pagetop { width: 100%; padding-bottom: 20px; }
.pagetop a { float: right; background: #E50012; padding: 5px 15px; color: #fff; }
.footer_last { background: #000; color: #fff; padding: 15px 40px; font-size: 60%; }
.footer_address { width: 60%; float: left; }
.footer_copyright { width: 40%; float: right; text-align: right; }

/*top motion text style================================================*/
.top_text_motion { position: absolute; top: 340px; right: 200px; opacity: 1; width: 560px; height: auto; z-index: 1000; font-size: 180%; color: #000000; font-weight: 600; }
.top_fadein1 {  animation-name:fadein1;animation-duration:2s; animation-delay: 0.3s; animation-fill-mode: forwards; opacity: 0; }
@keyframes fadein1{0%{opacity:0;transform:translateY(20px)}100%{display: block;opacity:1;transform:translateY(0)}}
.top_fadein2 {  animation-name:fadein2;animation-duration:2s; animation-delay: 0.6s; animation-fill-mode: forwards; opacity: 0; }
@keyframes fadein2{from{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}
.top_fadein3 {  animation-name:fadein3;animation-duration:2s; animation-delay: 0.9s; animation-fill-mode: forwards; opacity: 0; }
@keyframes fadein3{from{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}

 .fadein {
  opacity: 0;
  transform : translate(0, 50px);
  transition : all 1500ms;
}

.fadein.scrollin{
  opacity: 1;
  transform: translate(0, 0);
}


.btn_black { font-size: 90%; }
.btn_black a { display: inline-block; padding: 5px 50px; background: url(../img/btn_arrow.png) no-repeat 95% 50% #000; background-size: 6%; color: #fff; }

.SP_nav { display: none; }

/*第二階層-----------------------------------------------------*/
.content_main { min-height: 500px; padding: 40px 0; text-align: left; font-family: Georgia,游明朝,"Yu Mincho",YuMincho,"Hiragino Mincho ProN",HGS明朝E,メイリオ,Meiryo,serif; }
.content_main h2 { font-size: 180%; letter-spacing: 0.1em; padding-bottom: 3px; /*border-bottom: solid 3px #E50012;*/ display: inline-block; margin-bottom: 40px; color: #fff; padding: 60px; }
.content_main h3 { display: inline-block; font-size: 140%; margin: 20px 0 20px; border-bottom: solid 3px #E7C000; font-weight: 600; }
.content_main h4 { color: #E50012; font-size: 100%; border-bottom: solid 1px #E50012; font-weight: 600; }
.content_main h5 { font-size: 110%; color: #9F6900; padding: 30px 10px 10px; font-weight: 600; }
.content_main p { font-size: 80%; padding: 10px 0px 10px 15px; }
.content_main li { width: 222px; margin-right: 10px; float: left; font-size: 90%; text-align: center; }
.content_main li a { display: block; background: url(../img/btn_arrow.png) no-repeat 95% 50% #e6e6e6; padding: 5px 0; }
.content_main li a:hover { background: url(../img/btn_arrow.png) no-repeat 95% 50% #000; color: #fff; }
.content_main li.extra_btn01 a { display: block; background: url(../img/btn_arrow.png) no-repeat 95% 50% #E7C000; padding: 5px 0; }
.content_block { background: url(../img/content_line.png) repeat-x bottom; padding-bottom: 80px; margin-bottom: 80px; }
.content_block a { text-decoration: underline; }
.content_block h6 { font-size: 110%; color: #575757; padding: 10px 10px 10px; font-weight: 600; border-bottom: dashed 1px #575757; }
.business_archives { padding: 0 200px 40px 80px; height: 460px; overflow: scroll; margin-bottom: 40px; }
.business_archives li { width: 100%; border-bottom: dashed 1px #B3B3B3; padding: 20px 0; text-align: left; }
.business_archives li .archive_imgae { width: 17%; float: left; }
.business_archives li .archive_imgae img { border: solid 2px #E7C000; }
/* 2019.09.10 追加 */
.business_archives3 { /*padding: 0 100px 40px 80px;*/ height: 260px; overflow: scroll; margin-bottom: 40px; }
.business_archives3 li { width: 100%; border-bottom: dashed 1px #B3B3B3; padding: 20px 0; text-align: left; }
.business_archives3 li .archive_imgae { width: 17%; float: left; }
.business_archives3 li .archive_imgae img { border: solid 2px #E7C000; }
.content_main .business_archives3 li a { display: block; background: none; padding: 5px 0; }
.content_main .business_archives3 li a:hover { background: none; color: #fff; }

.archive_text { width: 82%; float: right; font-size: 120%; line-height: 160%; }
.archive_text h6 { font-size: 100%; font-weight: 600; }
.business_archives2 { height: 460px; overflow: scroll; margin-bottom: 20px; }
.archive_box { padding: 40px 200px 40px 80px; margin-bottom: 20px; }
.archive_th { background: #000; color: #fff; }
.archive_th01 { width: 17%; float: left; border-right: dashed 1px #B3B3B3; }
.archive_th02 { width: 83%; float: left; }
.archive_table { font-size: 100%; width: 100%; }
.archive_table th,td { padding: 10px; }
.archive_table th { width: 16%; border-bottom: dashed 1px #B3B3B3; }
.archive_table td { width: 81%; border-left: dashed 1px #B3B3B3; border-bottom: dashed 1px #B3B3B3; }

.event_left { width: 20%; float: left; }
.event_left img { width: 100%; }
.event_right { width: 75%; float: right; }
.event_right h5 { padding-top: 0px; }
.event_box { background: url(../img/content_line.png) repeat-x bottom; padding:10px 0 80px 0; margin-bottom: 60px; }

.page_link { margin-bottom: 40px; }
.page_link li { width: auto; margin-right: 25px; float: left; font-size: 80%; text-align: left; }
.page_link li a { display: block; background: none; padding: 5px 0; text-decoration: underline; }
.content_main li a:hover { background:none; color: #000; }
.fa-chevron-circle-down { margin-left: 5px; color: #E50012; }

.business_archives3 { height: 260px; overflow: scroll; margin-bottom: 20px; }
.archive_box4 { padding: 40px 100px 40px 20px; margin-bottom: 20px; }
.archive4_th { background: #000; color: #fff; }
.archive4_th01 { width: 10%; float: left; border-right: dashed 1px #B3B3B3; }
.archive4_th02 { width: 17%; float: left; border-right: dashed 1px #B3B3B3; }
.archive4_th03 { width: 17%; float: left; border-right: dashed 1px #B3B3B3; }
.archive4_th04 { width: 56%; float: left; }
.archive_table4 { font-size: 100%; width: 100%; }
.archive_table4 th,td { padding: 10px; vertical-align: middle; }
.archive_table4 .th10 { width: 10%; border-bottom: dashed 1px #B3B3B3; border-right: dashed 1px #B3B3B3; }
.archive_table4 .td17 { width: 17%; border-bottom: dashed 1px #B3B3B3;  border-right: dashed 1px #B3B3B3; }
.archive_table4 .td56 { width: 56%; border-bottom: dashed 1px #B3B3B3; }

.archive_box3 { padding: 40px 100px 40px 20px; margin-bottom: 20px; }
.archive_box3 th,td { vertical-align: middle; }
.archive3_th { background: #000; color: #fff; }
.archive3_th01 { width: 10%; float: left; border-right: dashed 1px #B3B3B3; }
.archive3_th02 { width: 17%; float: left; border-right: dashed 1px #B3B3B3; }
.archive3_th03 { width: 73%; float: left; }
.archive_table3 { font-size: 100%; width: 100%; }
.archive_table3 th,td { padding: 10px; }
.archive_table3 .th10 { width: 10%; border-bottom: dashed 1px #B3B3B3; border-right: dashed 1px #B3B3B3; }
.archive_table3 .td17 { width: 17%; border-bottom: dashed 1px #B3B3B3;  border-right: dashed 1px #B3B3B3; }
.archive_table3 .td73 { width: 73%; border-bottom: dashed 1px #B3B3B3; }

.archive_box3 { padding: 40px 100px 40px 20px; margin-bottom: 20px; }
.archive4_2_th { background: #000; color: #fff; }
.archive4_2_th01 { width: 17%; float: left; border-right: dashed 1px #B3B3B3; }
.archive4_2_th02 { width: 25%; float: left; border-right: dashed 1px #B3B3B3; }
.archive4_2_th03 { width: 20%; float: left; border-right: dashed 1px #B3B3B3; }
.archive4_2_th04 { width: 38%; float: left; }
.archive_table4_2 { font-size: 100%; width: 100%; }
.archive_table4_2 th,td { padding: 10px; }
.archive_table4_2 .th17 { width: 17%; border-bottom: dashed 1px #B3B3B3; border-right: dashed 1px #B3B3B3; }
.archive_table4_2 .td25 { width: 25%; border-bottom: dashed 1px #B3B3B3; border-right: dashed 1px #B3B3B3; }
.archive_table4_2 .td20 { width: 20%; border-bottom: dashed 1px #B3B3B3; border-right: dashed 1px #B3B3B3; }
.archive_table4_2 .td38 { width: 38%; border-bottom: dashed 1px #B3B3B3; }

.archive4_3_th { background: #000; color: #fff; }
.archive4_3_th01 { width: 17%; float: left; border-right: dashed 1px #B3B3B3; }
.archive4_3_th02 { width: 17%; float: left; border-right: dashed 1px #B3B3B3; }
.archive4_3_th03 { width: 20%; float: left; border-right: dashed 1px #B3B3B3; }
.archive4_3_th04 { width: 46%; float: left; }
.archive_table4_3 { font-size: 100%; width: 100%; }
.archive_table4_3 th,td { padding: 10px; }
.archive_table4_3 .th17 { width: 17%; border-bottom: dashed 1px #B3B3B3; border-right: dashed 1px #B3B3B3; }
.archive_table4_3 .td17 { width: 17%; border-bottom: dashed 1px #B3B3B3; border-right: dashed 1px #B3B3B3; }
.archive_table4_3 .td20 { width: 20%; border-bottom: dashed 1px #B3B3B3; border-right: dashed 1px #B3B3B3; }
.archive_table4_3 .td46 { width: 46%; border-bottom: dashed 1px #B3B3B3; }

.archive5_th { background: #000; color: #fff; }
.archive5_th01 { width: 17%; float: left; border-right: dashed 1px #B3B3B3; }
.archive5_th02 { width: 10%; float: left; border-right: dashed 1px #B3B3B3; }
.archive5_th03 { width: 17%; float: left; border-right: dashed 1px #B3B3B3; }
.archive5_th04 { width: 36%; float: left; border-right: dashed 1px #B3B3B3; }
.archive5_th05 { width: 20%; float: left; }
.archive_table5 { font-size: 100%; width: 100%; }
.archive_table5 th,td { padding: 10px; }
.archive_table5 .th17 { width: 17%; border-bottom: dashed 1px #B3B3B3; border-right: dashed 1px #B3B3B3; }
.archive_table5 .td10 { width: 10%; border-bottom: dashed 1px #B3B3B3; border-right: dashed 1px #B3B3B3; }
.archive_table5 .td17 { width: 17%; border-bottom: dashed 1px #B3B3B3; border-right: dashed 1px #B3B3B3; }
.archive_table5 .td36 { width: 36%; border-bottom: dashed 1px #B3B3B3; border-right: dashed 1px #B3B3B3; }
.archive_table5 .td20 { width: 20%; border-bottom: dashed 1px #B3B3B3; }

.about_image { width: 28%; float: left; }
.about_text { width: 72%; float: right; letter-spacing: 0.05em; }
.about_image2 { width: 30%; float: right; text-align: center; font-size: 100%!important; height: 500px; }
.about_text2 { width: 70%; float: left; letter-spacing: 0.05em; }
.about_history li { border-bottom: dashed 1px #ddd; width: 100%; text-align: left; font-size: 120%; }
.about_history_year { width: 15%; float: left; }
.about_history_text { width: 85%; float: left; }

.structure_list { margin-left: 40px; }
.structure_list li { float: none; width: 100%; text-align: left; list-style-type: decimal }
.structure_box2 { padding: 0px; margin-bottom: 20px; width: 100%; border: solid 1px #cbcbcb; }
.structure2_td01 { width: 20%; background: #000; color: #fff; }
.structure2_td02 { width: 80%; border-bottom: solid 1px #B3B3B3; }
.structure_box7 { padding: 0px; margin-bottom: 20px; width: 100%; border: solid 1px #cbcbcb; }
.structure7_td01 { width: 10%; background: #000; color: #fff; }
.structure7_td02 { width: 15%; border-bottom: solid 1px #B3B3B3;  border-right: solid 1px #B3B3B3; }
.structure7_td03 { width: 15%; border-bottom: solid 1px #B3B3B3; }
.structure_image { text-align: center; padding-top: 30px!important; }

.information_left { width: 60%; float: left; padding: 20px 0;  }
.information_right { width: 40%; float: right; display: table-cell; vertical-align: bottom; positoin: absolute; bottom: 0; height: 100%; padding: 20px 0; }

.news_list {  }
.news_list li { float: none; width: 100%; border-bottom: dashed 1px #ccc; font-size: 120%; text-align: left; }
.news_list .news_text a { display: inline; color: #E50012; background: none; }

.business_h2 { background: url(../img/business_h2_bg.jpg); display: block; width: 100%; text-align: center; }
.notice_h2 { background: url(../img/notice_h2_bg.jpg); display: block; width: 100%; text-align: center; }
.about_h2 { background: url(../img/about_h2_bg.jpg); display: block; width: 100%; text-align: center; }
.information_h2 { background: url(../img/information_h2_bg.jpg); display: block; width: 100%; text-align: center; }
.news_h2 { background: url(../img/news_h2_bg.jpg); display: block; width: 100%; text-align: center; }

.newsletter_list {  }
.newsletter_list li { border-bottom: dashed 1px #B3B3B3; width: 100%; text-align: left; }
.newsletter_list_title { width: 50%; float: left; font-size: 100%!important; }
.newsletter_btn { width: 20%; float: right; font-size: 100%!important; text-align: center; }
.newsletter_btn a { display: inline-block; padding: 5px 50px; background: url(../img/btn_arrow.png) no-repeat 95% 50% #000!important; background-size: 6%; color: #fff; }
.newsletter_btn a:hover { background: #d5d5d5!important; }

.swiper-container { text-align: center; }
.swiper-container .swiper-slide img { max-width: 100%; height: auto; }
.prettyprint { border: none; background: #fafafa; color: #697d86; }

.notice_extra_text { text-align: right; }
.mb60 { margin-bottom: 60px!important; }
.mb100 { margin-bottom: 100px!important; }
.mb40 { margin-bottom: 40px; }
.pb100 { padding-bottom: 100px; }
.text_red { color: #e50012; font-weight: 600; }
.link_red a { color: #E50012; }
.mt20 { margin-top: 20px; }

#news_box { color: #fff!important; margin-right: 5px; }
.support_bkup { margin-bottom: 80px; }
.support_bkup ul {  margin-bottom: 40px;  }
.support_bkup li { width: 100%; text-align: left; padding: 10px 0 10px 10px; font-size: 100%; }
.support_bkup li a { background: none; display: inline; }
.support_event_link a { color: #E50012; }

.extra20181013 { width: 100%; float: none; text-align: center; border: solid 2px #000; padding: 0.7em; font-size: 90%; margin-bottom: 1em; font-weight: 600; line-height: 140%; }
.extra20181013_2 { width: 49%; float: left; text-align: center; border: solid 2px #000; padding: 0.7em; font-size: 90%; margin-bottom: 1em; font-weight: 600; line-height: 140%; }
.extra20181013_3 { width: 49%; float: left; text-align: center; border: solid 2px #000; padding: 0.6em 0.7em; font-size: 90%; margin-bottom: 1em; font-weight: 600; line-height: 120%; }
.extra20190430 a { width: 49%; float: right; text-align: center;  padding: 1.6em 0; font-size: 140%; margin-bottom: 1em; font-weight: 600; line-height: 140%; background: #e50012; color: #fff; }
.extra20190430_2 { width: 49%; float: right; text-align: center; border: solid 2px #000; padding: 1.55em 0; font-size: 140%; margin-bottom: 1em; font-weight: 600; line-height: 140%; }
.extra20191110 a { width: 49%; float: right; text-align: center;  padding: 1.7em 1.2em; font-size: 100%; margin-bottom: 1em; font-weight: 600; line-height: 160%; background: #e50012; color: #fff; }
.extra20200327 a { width: 49%; float: right; text-align: center;  padding: 1.7em 1.2em; font-size: 100%; margin-bottom: 1em; font-weight: 600; line-height: 160%; background: #ffffff; color: #e50012; border: solid 2px #e50012; }
.extra20200511 { width: 49%; float: right; text-align: center;  padding: 0.9em 1.2em; font-size: 100%; margin-bottom: 1em; font-weight: 600; line-height: 160%; background: #ffffff; color: #e50012; border: solid 2px #e50012; }
.extra20200814 { width: 100%; float: none; text-align: center;  padding: 0.9em 1.2em; font-size: 100%; margin-bottom: 1em; font-weight: 600; line-height: 160%; background: #ffffff; color: #e50012; border: solid 2px #e50012; }
.extra20200814 p { width: 30em; margin: 0 auto; text-align: left; font-size: 100%; }
.extra20200327_2 { width: 49%; float: left; text-align: center;  padding: 0.57em 1.2em; font-size: 90%; margin-bottom: 1em; font-weight: 600; line-height: 160%; background: #e50012; color: #fff; }
.extra20200327_2 a { color: #ffffff; font-size: 110%; text-decoration: underline; font-weight: 600; margin: 0 3px 0 1px; }