/*
dog
#eefafb
#3fc5d5


cat
#fff5f6
#ff9b9e

*/


body{ margin: 0;}
#info{
	font-family:"Hiragino Kaku Gothic ProN","メイリオ", sans-serif;
	color:#4d4d4d;
	font-size: 16px;
	width: 100%;
	margin: auto;
	padding-bottom: 4em;}
#info img{max-width:100%;}

#info{ background: #eefafb;}
#info.cat{ background: #fff5f6;}



#info{}
#info *{ box-sizing: border-box; font-weight: inherit;}
#info .co_wrap{max-width: 960px; width: 100%; margin: auto; padding: 0 4em;}
#info .modules_wrap .modules{ margin-top: 2.5em; padding-top: 2.5em; position: relative;}
#info .modules_wrap .modules::after{ content: ""; position: absolute; left: 0; right: 0; top: 0; margin: auto; width: 80%; height: 0; opacity: 0.2; max-width: 800px; border-top: 1px solid #3fc5d5;}
#info.cat .modules_wrap .modules::after{ border-top: 1px solid #ff9b9e;}
#info .modules_wrap .modules:first-of-type{ margin-top: 4em; padding-top: 0;}
#info .modules_wrap .modules:first-of-type::after{ display: none;}

#info h2.co_ttl{  font-size: 1.3em;margin: 0 0 0.25em;font-weight: 600; padding-left: 1.25em; text-indent: -1.25em; line-height: 1.2;;}
#info h2.co_ttl::before{ content: "●"; display: inline-block; margin-right: 0.25em; text-indent: 0;}
#info h2.co_ttl::before{color: #36bfd0;}
#info.cat h2.co_ttl::before{color: #fd7e8c;}
#info .ib{display: inline-block;}

#info .flex_wrap{display:flex;justify-content:center;align-items:center;}
#info .text b{ display: block; font-weight: bold;}
#info .text .kome{ display: block; padding-left: 1em; text-indent: -1em;;}
#info .text .kome *{ text-indent: 0;}




#info .header{background: #FFF; text-align: center; padding: 2em 0; margin-bottom: 4em;;}
#info .header .logo{ width: 320px; margin: auto;}
#info .header h1.ttl{ font-size: 32px; letter-spacing: 0.1em;}



#info .kakaku_wrap .table{ display:flex;justify-content:center;align-items:flex-start;text-align: center; width: 100%; position: relative;}
#info .kakaku_wrap .table .tr{ width: 50%; position: relative;}
#info .kakaku_wrap .table .th{  background: #b2b2b2; color: #FFF; font-weight: bold; font-size: 1.3em; padding: 0.3em 0;}
#info .kakaku_wrap .table .td{  background: #FFF;}
#info .kakaku_wrap .table .tr:first-of-type .th,
#info .kakaku_wrap .table .tr:first-of-type .td{ border-right: 1px solid #999;}

#info .kakaku_wrap .table .td.table_wrap{ padding: 1em 2em;;}
#info .kakaku_wrap .table .td.table_wrap .kakaku{ font-size: 1.3em; font-weight: bold;}
#info .kakaku_wrap .table .td.table_wrap .kakaku span{ font-size: 1.6em;}
#info .kakaku_wrap.dog .table .td.table_wrap .kakaku span{ color: #44c4d3;}
#info .kakaku_wrap .table .td.table_wrap .nenkan{ border: 1px solid; display: inline-block; font-weight: 600; padding: 0em 2em; border-radius: 1em; margin: 0.2em auto 0.5em;;}
#info .kakaku_wrap .table .td.table_wrap .souryou{ text-align: right; font-size: 0.8em;;}
#info .kakaku_wrap .table .td.table_wrap .souryou span{}

#info .kakaku_wrap .table .otoku{ position: absolute; width: 8em; right: -3em; top: -2.3em;}

/*1号無料*/
#info .kakaku_wrap .color{color: #fd7e8c;}
#info.cat .kakaku_wrap .color{color: #36bfd0;}
#info .kakaku_wrap .table2 .th{background: #fd7e8c;}
#info.cat .kakaku_wrap .table2 .th{background: #36bfd0;}
#info .kakaku_wrap .yajirushi{width: 4em; margin: 1em auto -1em;}
#info .kakaku_wrap .sub_ttl{ text-align: center; font-weight: bold; font-size: 1.4em; margin: 1em auto 0.5em; line-height: 1.4;}
#info .kakaku_wrap .table2{}
#info .kakaku_wrap .table2 .td.table_wrap .kakaku{ font-size: 1.9em;}
#info .kakaku_wrap .table2 .setumei_wrap{ position: relative; padding: 1em 0 1.25em;}
#info .kakaku_wrap .table2 .setumei_wrap::after{ content: ""; width: 90%; height: 0; position: absolute; top: 0; left: 0; right: 0; margin: auto; border-top: dotted #888;}
#info .kakaku_wrap .table2 .setumei_wrap .text{ font-weight: 600; font-size: 0.9em;}

#info .kakaku_wrap .add_comment{ text-align: center; border: 2px solid; border-radius: 1em; padding: 0.5em 0; background: #FFF; margin: 0.5em auto 0; position: relative;}
#info .kakaku_wrap .add_comment::before {content: "";position: absolute;top: -23px;right: 180px; transform: translateX(50%); border: 12px solid transparent;border-bottom: 12px solid #FFF;z-index: 2;}
#info .kakaku_wrap .add_comment::after {content: "";position: absolute;top: -27px;right: 180px; transform: translateX(50%); border: 13px solid transparent;border-bottom: 13px solid #555;z-index: 1;}
#info .kakaku_wrap .add_comment .kome{ text-align: left; display: inline-block;}




#info .payment_wrap{ text-align: center; margin: 1em auto;}
#info .payment_wrap .creca{ border-right: 1px solid #999; margin-right: 2em; padding-right: 2em;;}
#info .payment_wrap .conveni{}
#info .payment_wrap .icon{width: 5em;margin: auto;}
#info .payment_wrap .name{ font-size: 1.2em; font-weight: bold; margin: 0.5em auto 0.5em;}
#info .payment_wrap .comment{ border: 1px solid; display: inline-block; font-weight: 600; min-width: 13em; padding: 0.5em 2em; border-radius: 1.5em; margin: 0.2em auto 0.5em; line-height: 1.2;}
#info .payment_wrap .creca .comment{padding: 1em 2em;}
#info .payment_wrap .comment .s{ font-size: 0.8em;}




#info .mo_otoku_normal{ margin-top: 2em;}
#info .otoku_wrap{ background: #FFF; border-radius: 1em; padding: 2em;text-align: center;}
#info .otoku_wrap .color{color: #3fc5d5;}
#info .otoku_wrap .color_r{color: #ff9b9e;}
#info.cat .otoku_wrap .color{color: #ff9b9e;}
#info.cat .otoku_wrap .color_r{color: #3fc5d5;}

#info .otoku_wrap .ttl_text{ text-align: center; font-weight: bold; font-size: 1.4em;;}
#info .otoku_wrap .ttl_text .big{ font-weight: bold; display: block; font-size: 1.2em;}


#info .otoku_wrap .flex_wrap{ margin: 1em auto; }
#info .otoku_wrap .data{ border:2px solid; padding: 0.75em; border-radius: 1em; font-weight: bold; line-height: 1.2; min-width: 15em; text-align: center;font-size: 1.1em;}
#info .otoku_wrap .data .small{ font-size: 0.9em;}
#info .otoku_wrap .data .big{ font-size: 1.5em;}
#info .otoku_wrap .plus{ width: 1.5em; margin: 0 1em;}
#info .otoku_wrap .yajirushi{ width: 4em; margin: 0.5em auto;}
#info .otoku_wrap .data3{ width: 100%; max-width: 590px; min-width: none; display: inline-block; padding: 1em 0em; font-size: 1.4em;}
#info .otoku_wrap .comment{ text-align: right; margin: 1.5em auto 0; font-size: 0.9em;}

#info .otoku_wrap .data1,
#info .otoku_wrap .data2{ border-color: #3fc5d5;}
#info .otoku_wrap .data3{ border-color: #ff9b9e; background: #ffffb2;}
#info.cat .otoku_wrap .data1,
#info.cat .otoku_wrap .data2{ border-color: #ff9b9e;}
#info.cat .otoku_wrap .data3{ border-color: #3fc5d5;}




@media (max-width:699px){

#info{}
#info .co_wrap{max-width: 700px; width: 94%; margin: auto; padding: 0;}
#info h2.co_ttl{font-size: 1.3em; margin: 0 0 0.3em;;}

#info .header .logo{ max-width: 320px; width: 80%; margin: auto;}
#info .header h1.ttl{ font-size: 22px; }



#info .kakaku_wrap .table{display: block;}
#info .kakaku_wrap .table .tr{ width: 100%;}
#info .kakaku_wrap .table .th{ font-size: 1.1em; padding: 0.4em 0;}
#info .kakaku_wrap .table .td{ }
#info .kakaku_wrap .table .tr{ margin-top: 1.5em;}
#info .kakaku_wrap .table .tr:first-of-type .th,
#info .kakaku_wrap .table .tr:first-of-type .td{ border-right: none;}

#info .kakaku_wrap .table .td.table_wrap{ padding: 1em 0.5em;}
#info .kakaku_wrap .table .td.table_wrap .kakaku{ font-size: 1.1em; }
#info .kakaku_wrap .table .td.table_wrap .kakaku span{ font-size: 1.7em;}

#info .kakaku_wrap .table .otoku{ position: absolute; width: 30%; max-width: 120px; right: -1em; top: 1.5em; transform: translateY(-50%);}

/*1号無料*/
#info .kakaku_wrap .sub_ttl{margin: 1em auto -0.75em; font-size: 1.2em;}

#info .kakaku_wrap .add_comment{ text-align: center; border: 2px solid; border-radius: 1em; padding: 0.5em 1em; background: #FFF; margin: 0.5em auto 0; position: relative;}
#info .kakaku_wrap .add_comment::before {right: 50%;}
#info .kakaku_wrap .add_comment::after {right: 50%;}
#info .kakaku_wrap .add_comment .kome{ font-size: 0.8em; line-height: 1.2; padding-left: 1em; text-indent: -1em;}




#info .payment_wrap{ margin: 1em auto;}
#info .payment_wrap .flex_wrap{ display: block; margin: 2em auto;}
#info .payment_wrap .creca{ border-right: none; margin-right: 0; padding-right: 0; border-bottom: 1px solid #999; margin-bottom: 1em; padding-bottom: 1em;;}
#info .payment_wrap .conveni{}
#info .payment_wrap .icon{width: 4em; margin: auto;}
#info .payment_wrap .name{ font-size: 1.1em;  margin: 0.25em auto 0.25em;}
#info .payment_wrap .comment{min-width: auto; width: 90%; max-width: 320px; padding: 0.5em 0;}





#info .otoku_wrap{ background: #FFF; border-radius: 1em; padding: 1em 1em 1.5em;text-align: center;}

#info .otoku_wrap .ttl_text{ text-align: center; font-weight: bold; font-size: 1.3em;;}
#info .otoku_wrap .ttl_text .big{ font-weight: bold; display: block; font-size: 1.2em;}


#info .otoku_wrap .flex_wrap{ margin: 1em auto; font-size: 3.9vw;}
#info .otoku_wrap .data{min-width: 0; width: auto; font-size: 1em;}
#info .otoku_wrap .data .small{ font-size: 0.9em;}
#info .otoku_wrap .data .big{ font-size: 1.5em;}
#info .otoku_wrap .plus{ width: 1em; margin: 0 0.5em;}
#info .otoku_wrap .yajirushi{ width: 3em; margin: 0.5em auto;}
#info .otoku_wrap .data3{ width: 100%; min-width: none; display: inline-block; padding: 1em 0; font-size: 1.0em;}
#info .otoku_wrap .comment{ text-align: right; margin: 1.5em auto 0; font-size: 12px;}



}