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

/*All-------------------------------------------*/
.cpWarp {width: 100%; height: 30px; margin: 0 0 8px; float: left;}

/*PC:body-------------------------------------*/
@media screen and (min-width:1084px) {

.cpSpc {width: 100%; max-width: 1000px; height: 30px; margin: 0px auto; font-size: 14px;}
.cp_breadcrumb *, .cp_breadcrumb *:after, .cp_breadcrumb *:before {-webkit-box-sizing: border-box; box-sizing: border-box;}
.cp_breadcrumb {margin: auto; padding: 10px 16px; color: #C90000;}
.cp_breadcrumb a {text-decoration: none; color: #353535;}
.cp_breadcrumb .breadcrumbs {padding-left: 0; margin-top: 0; margin-bottom: 0; list-style: none; display: flex; flex-wrap: wrap;}
.cp_breadcrumb li {display: inline-block; position: relative; padding-right: calc(16px + 8px); margin-right: 8px; color: #CCCCCC;}
.cp_breadcrumb li::before {content: '›'; width: 18px; height: 18px; line-height: 1; text-align: center; font-size: 18px; color: inherit; position: absolute; top: 50%; right: 0; -webkit-transform: translateY(-50%);  transform: translateY(-50%);}
.cp_breadcrumb li:last-child {margin-right: 0; padding-right: 0; color: #FF6699;}
.cp_breadcrumb li:last-child::before {content: normal;}
.breadcrumb {padding: 0; margin: 0;}

}

/*TB:body-------------------------------------*/
@media screen and (min-width: 560px) and (max-width: 1083px) {

.cpSpc {width: 98%; height: 30px; margin: 0px auto; font-size: 14px;}
.cp_breadcrumb *, .cp_breadcrumb *:after, .cp_breadcrumb *:before {-webkit-box-sizing: border-box; box-sizing: border-box;}
.cp_breadcrumb {margin: auto; padding: 10px 10px; color: #C90000;}
.cp_breadcrumb a {text-decoration: none; color: #353535;}
.cp_breadcrumb .breadcrumbs {padding-left: 0; margin-top: 0; margin-bottom: 0; list-style: none; display: flex; flex-wrap: wrap;}
.cp_breadcrumb li {display: inline-block; position: relative; padding-right: calc(14px + 3px); margin-right: 3px; color: #CCCCCC;}
.cp_breadcrumb li::before {content: '›'; width: 14px; height: 14px; line-height: 1; text-align: center; font-size: 14px; color: inherit; position: absolute; top: 50%; right: 0; -webkit-transform: translateY(-50%);  transform: translateY(-50%);}
.cp_breadcrumb li:last-child {margin-right: 0; padding-right: 0; color: #FF6699;}
.cp_breadcrumb li:last-child::before {content: normal;}
.breadcrumb {padding: 0; margin: 0;}

}

/*SP:body-------------------------------------*/
@media screen and (max-width: 559px) {

.cpSpc {width: 96%; height: 30px; margin: 0px auto; font-size: 14px;}
.cp_breadcrumb *, .cp_breadcrumb *:after, .cp_breadcrumb *:before {-webkit-box-sizing: border-box; box-sizing: border-box;}
.cp_breadcrumb {margin: auto; padding: 10px 0px; color: #C90000;}
.cp_breadcrumb a {text-decoration: none; color: #353535;}
.cp_breadcrumb .breadcrumbs {padding-left: 0; margin-top: 0; margin-bottom: 0; list-style: none; display: flex; flex-wrap: wrap;}
.cp_breadcrumb li {display: inline-block; position: relative; padding-right: calc(14px + 1px); margin-right: 1px; color: #CCCCCC;}
.cp_breadcrumb li::before {content: '›'; width: 10px; height: 24px; line-height: 24px; text-align: center; font-size: 24px; color: inherit; position: absolute; top: 35%; right: 0; -webkit-transform: translateY(-35%);  transform: translateY(-35%);}
.cp_breadcrumb li:last-child {margin-right: 0; padding-right: 0; color: #FF6699;}
.cp_breadcrumb li:last-child::before {content: normal;}
.breadcrumb {padding: 0; margin: 0;}

}