@charset "utf-8";
/* CSS Document */

.container{ width: 100%; height: 100%; margin-top: 0; text-align: left; background: url(/images/2nd_bg.png) repeat-y 50% 0%;}
.h1box{ padding-left: 280px;}
.catalog{ background: url(/images/product/h1_catalog_pict.png) 7% 0 no-repeat; background-size: 145px auto;}
.manual{ background: url(/images/product/h1_manual_pict.png) 7% 0 no-repeat; background-size: 145px auto;}
.document{ background: url(/images/product/h1_document_pict.png) 7% 0 no-repeat; background-size: 145px auto;}
.newsletter{ background: url(/images/product/h1_newsletter_pict.png) 7% 0 no-repeat; background-size: 145px auto;}
.memorial{ background: url(/images/product/h1_memorial_pict.png) 7% 0 no-repeat; background-size: 145px auto;}
.report{ background: url(/images/product/h1_report_pict.png) 7% 0 no-repeat; background-size: 145px auto;}
.textbook{ background: url(/images/product/h1_textbook_pict.png) 7% 0 no-repeat; background-size: 145px auto;}
.graduation_essay{ background: url(/images/product/h1_graduation_essay_pict.png) 7% 0 no-repeat; background-size: 145px auto;}
.graduation_album{ background: url(/images/product/h1_graduation_album_pict.png) 7% 0 no-repeat; background-size: 145px auto;}
.program{ background: url(/images/product/h1_program_pict.png) 7% 0 no-repeat; background-size: 145px auto;}
.novel{ background: url(/images/product/h1_novel_pict.png) 7% 0 no-repeat; background-size: 145px auto;}
.anthology{ background: url(/images/product/h1_anthology_pict.png) 7% 0 no-repeat; background-size: 145px auto;}
.personal_book{ background: url(/images/product/h1_personal_book_pict.png) 7% 0 no-repeat; background-size: 145px auto;}
.picture_book{ background: url(/images/product/h1_picture_book_pict.png) 7% 0 no-repeat; background-size: 145px auto;}
.scenario{ background: url(/images/product/h1_scenario_pict.png) 7% 0 no-repeat; background-size: 145px auto;}
.dojinshi{ background: url(/images/product/h1_dojinshi_pict.png) 7% 0 no-repeat; background-size: 145px auto;}
.album{ background: url(/images/product/h1_album_pict.png) 7% 0 no-repeat; background-size: 145px auto;}

.psizelst{margin: 20px auto;}
.psizelst li{width: 60px; height: 60px; margin-right: 10px; font-size: 2.6rem; line-height: 60px; font-weight: bold; text-align: center; color: #ffffff; border-radius: 30px; background: #f49e00;}
.ptrnbox{width: 210px; margin: 0 15px 50px;}
.ptrnbox .ptrnttl{ margin-bottom: 20px !important; font-size: 2rem; font-weight: bold; text-align: center;}
.ptrnbox .ptrnttl img{ display: block; margin: 5px auto;}
.ptrnbox .ptrnlst{ margin-bottom: 10px;}
.ptrnbox .ptrnlst dt{ width: 30%; height: 4em; padding: .3em 0; border-bottom: 1px solid #000000;}
.ptrnbox .ptrnlst dd{ width: 70%; height: 4em; padding: .3em 0; border-bottom: 1px solid #000000;}
.ptrnbox .ptrnlst dt:first-child{ height: 2.4em;}
.ptrnbox .ptrnlst dt:first-child + dd{ height: 2.4em;}

.atbox{ width: 76%; margin: 0 auto 40px; padding: 1em 1.5em; background: #ffe2e4;}
.atbox .attxt{ margin-bottom: 10px;}
.atbox .attxt span{ display: block;}
.atbox li{ list-style: disc; margin-left: 20px;}

.itm_btn{ width: 500px; margin: 20px auto 0;}
.itm_btn li{ width: 48%; margin-bottom: 20px;}
.itm_btn .lsize{ width: 100%;}

@media screen and (max-width: 767px) {
	.h1box{ padding-left: 35%; background-size: 25% auto;}
	.itm_btn{ width: 100%; margin: 20px auto 0;}
}