@charset "shift_jis";
/* CSS Document */
/*PC*/

/*------------------------��{CSS------------------------*/
*{ list-style:none; margin:0; padding:0;}
a{ text-decoration:none;}
a img{ border:none;}
a:hover img{ opacity:0.8;}
img{ vertical-align:bottom;}

#wrap2{ max-width: 750px; margin:0 auto;  width: auto;font-family:"Century Gothic",Noto Sans JP,sans-serif;color: black;}
#wrap2 section{ background-color: #eeecdf; margin-top: 100px;}
  
#wrap2 div#kanban p{font-size: 0.9em;text-align: center; padding: 1%;}

/*------------------------���i�R�[�i�[------------------------*/

/*�����������S�u���b�N���ʁ���������*/
#wrap2 .itemcorner{ margin: 0 3%;}

/*�����N�̔���*/
#wrap2 .itemcorner a {
    background-color: none;
    -webkit-transition: all 0.3s ease;
    -moz-transition: all 0.3s ease;
    -o-transition: all 0.3s ease;
    transition: all  0.3s ease;
    }
#wrap2 .itemcorner a:hover {
    background-color: #999;
    opacity: 0.2;
    }

/*�ڍׂ͂�����{�^��*/
#wrap2 .itemcorner dd.botan{margin-top: 2%; font-size: 0.9em;}
#wrap2 .itemcorner dd.botan p{ color: white!important; background-color: black;text-align: center;padding: 1% 0;
    border-radius:90px;		/* CSS3���� */
	-webkit-border-radius: 90px;	/* Safari,Google Chrome�p */
	-moz-border-radius: 90px;	/* Firefox�p */}
#wrap2 .itemcorner dd.botan span{vertical-align: bottom;}

/*��������*/
#wrap2 .itemcorner dd.heig{text-align: center;font-weight: bold;    background-color: #d6d4c7;}
#wrap2 .itemcorner dd.heig{font-size: 1.2em;}


/*����������1�񁚁�������*/
#wrap2 .itemcorner div.blo1{ clear: both;position: relative;     padding: 1%;}
/*�R�����g*/
#wrap2 .itemcorner div.blo1 div.come{ float: left; width: 49%; margin: 2% auto 3%; font-size: 0.8em;}
#wrap2 .itemcorner div.blo1 div.come:nth-child(odd){clear: both; margin-right: 2%!important;}
/*�����N*/
#wrap2 .itemcorner div.blo1 a{ position: absolute; width: 100%; height: 100%; top:0; left: 0;text-indent: 100%; white-space: nowrap;overflow: hidden;}


#wrap2 .itemcorner div.blo1 dl{ float: left; width: 30%; padding: 1%;}
#wrap2 .itemcorner div.blo1 dt{ font-weight: bold;font-size: 1.5em; line-height: 1.2em;margin-bottom: 3%;    /*padding-bottom: 3%; border-bottom: 3px black solid;*/}
/*�����N*/
#wrap2 .itemcorner div.blo1 dl a {
    background-color: none;
    -webkit-transition: all 0.3s ease;
    -moz-transition: all 0.3s ease;
    -o-transition: all 0.3s ease;
    transition: all  0.3s ease;
    }
#wrap2 .itemcorner div.blo1 dl a:hover {
    background-color: #999;
    opacity: 0.2;
    }        
/*�摜*/#wrap2 .itemcorner div.blo1 div.itemimg{float: left; width: 65%; margin-right: 3%; }



/*����������PC/3�񁚁�������*/
#wrap2 .itemcorner div.blo3 dl{ float: left; width:29.7%;   margin-top: 3%; position: relative;padding: 1%; border: 1px black solid;}
#wrap2 .itemcorner div.blo3 dl.cenb{ margin-right: 2%; margin-left: 2%;}
#wrap2 .itemcorner div.blo3 dl:nth-child(3n+1){clear: both;}
#wrap2 .itemcorner div.blo3 dt{ font-size: 0.8em;margin-bottom: 3%;    height: 3em;}
/*����*/
#wrap2 .itemcorner div.blo3 dd.heig{ margin-top: 2%;}
#wrap2 .itemcorner div.blo3 dd.heig span{font-size: 0.6em;}
/*�摜*/#wrap2 .itemcorner div.blo3 dd.itemimg{clear: both;}
/*�J���o��*/#wrap2 .itemcorner div.blo3 dd.colv{ font-size: 1.8em;    margin: -3% 0;}
/*�����N*/
#wrap2 .itemcorner div.blo3 dl a{ position: absolute; width: 100%; height: 100%; top:0; left: 0;text-indent: 100%; white-space: nowrap;overflow: hidden;}



/*------------------------����------------------------*/

#wrap2 section#page1,#wrap2 section#page2,#wrap2 section#page3{ position: relative;}
#wrap2 section#page1 .cat2{position: absolute; bottom: -4.2%;right: 0;width: 40%;}
#wrap2 section#page2 .cat1{position: absolute; bottom: 0; right: 5%;width: 30%; }
#wrap2 section#page3 .cat4{position: absolute; bottom: 0; right: 1%;width: 30%; }