/*allergy*/
:root {
    --baseDeepBlue: #004098;
    --lightPurple: #E9E9F5;
    --tableBgGray: #F1F1F1;
    --tableBorderGray: #CDCDCD;
    --tableNotoBrown: #814235;
}

/*allergyArea
------------------------------------------------------------------------------------------------------*/
.allergy .categoryPict{
	background: url(../../images/pic_about01.png) no-repeat right top;
	background-size: 484px;
}
.allergyArea {
	width: 1040px;
	margin: 0 auto;
	padding: 0 0 80px;
}
@media screen and (max-width: 640px)  {
	.allergy .categoryPict{
		display: none;
	}
	.allergyArea {
		width: calc(100% - 30px);
		padding: 20px 15px 60px;
		background: #fff;
	}
}

/*allergyTxtArea
------------------------------------------------------------------------------------------------------*/
.allergyCopy {
	margin: 0px 0px 10px 0px;
    font-size: 182%;
    font-weight: bold;
    line-height: 150%;
	color: #004098;
}
.allergyTxt {
    font-size: 105%;
    line-height: 155%;
}

.allergyTxt a {
    margin-top: 8px;
    color: #005cc1;
    text-decoration: underline;
}
ul.allergyList {
	margin-top: 24px;
	padding: 20px 20px 8px 20px;
    font-size: 105%;
    line-height: 155%;
	background:#FAF6EE;
}
ul.allergyList li {	
	margin-bottom: 20px;

}
ul.allergyList li > h3 {
	margin-bottom: 3px;
    font-size: 116%;
    line-height: 170%;
	color:#F08900;
}
ul.allergyList li > p {
	margin-bottom: 5px;
    font-size: 105%;
    line-height: 160%;
}
@media screen and (max-width: 640px)  {
    .allergyCopy {
        margin: 0px 0px 10px 0px;
        font-size: 126%;
        line-height: 155%;
    }
    .allergyTxt {
        font-size: 108%;
        line-height: 174%;
    }
}

/*pageLinkArea
------------------------------------------------------------------------------------------------------*/
.pageLinkArea {
    margin: 34px 0 30px 0;
    padding: 34px 0 0 0;
    border-top: 2px dotted #000000;
}
.pageLinkList{
	display: flex;
    align-items: center;
    flex-wrap: wrap;
    justify-content: flex-start;
	gap: 10px 15px;
}
.pageLinkItem{
	color:#fff;
}
a.pageLink{
	display: inline-block;
    background: var(--baseDeepBlue);
    color:#fff;
    font-size: 100%;
    font-weight: 700;
    line-height: 210%;
    border-radius: 5px;
    padding: 0 35px 0 10px;
    position: relative;
}
.pageLink:after {
    content: '';
    display: block;
    position: absolute;
    top: 50%;
    right: 10px;
    width: 6px;
    height: 6px;
    border-top: 2px solid #fff;
    border-right: 2px solid #fff;
    transform: rotate(135deg);
    margin: -6px 0 0 0;
}
@media screen and (max-width: 640px)  {
    .pageLinkArea {
        margin: 22px 0 30px 0;
        padding: 22px 0 0 0;
    }
    .pageLinkList{
        gap: 10px 5px;
    }
    a.pageLink{
        font-size: 100%;
        padding: 3px 17px 3px 5px;
        line-height: 1.6rem;
        height: auto;
    }
    .pageLink:after {
        right: 6px;
        border-top: 1px solid #fff;
        border-right: 1px solid #fff;
        width: 5px;
        height: 5px;
        margin: -4px 0 0 0;
    }
}


/*Table
------------------------------------------------------------------------------------------------------*/
.allergyTableDetail:not(:last-of-type){
     margin: 0 0 34px 0;
}
.allergyTableTit {
    background: var(--lightPurple);
    color: var(--baseDeepBlue);
    font-weight: bold;
    font-size: 135%;
    padding: 6px 20px;
    margin: 0 0 12px 0;
}
.allergyTable {
    border-collapse: collapse;
    font-size: 110%;
    border-top: var(--tableBorderGray) 1px solid;
    width: 100%;
    background: #fff;
    table-layout: fixed;
}
#mix .allergyTable {
    table-layout: auto;
}
.althead {
    background: var(--tableBgGray);
    text-align: center;
}
.alTable{
    line-height: 125%;
    padding: 15px 10px;
}
.alTableTr {
    border-bottom: var(--tableBorderGray) 1px solid;
}
.alTableTh {
    background: var(--tableBgGray);
    text-align: center;
}
.alTableTh.hinmei {
	width: 329px;
}
.code{
    font-weight: normal;
}
@media screen and (max-width: 640px)  {
	.alTableTh.hinmei {
	width: 31%;
	}
}

.alTableTh.biko {
	width: 329px;
}
@media screen and (max-width: 640px)  {
	.alTableTh.biko {
	width: 32%;
	}
}

.alTableTb {

}
.alTableTb.tableAllergy{
    text-align: center;
}
.alTableTb.tableAllergy.code{
	
}
.alTableOthers{
    font-size: 95%;
}
.alTableTb.alTableOthers{
    text-align: center;
}
.alTableTb.alTableOthers.contami{
    text-align: left;
}
.tableProductName {
	text-align: left;
}
.alTable:not(:last-of-type),
.tableProductName {
    border-right: var(--tableBorderGray) 1px solid;
}
@media screen and (max-width: 640px)  {
    .allergyTableTit {
        font-size: 115%;
    }
    .allergyTableCts {
        width: 100%;
        overflow-x: scroll;
    }
    .allergyTable {
        width: 640px;
        font-size: 100%;
    }
    #mix .allergyTable {
        width: 1040px;
    }
    .alTable{
        white-space: wrap;
        padding: 10px 5px;
    }
    .alNote {
        color: var(--tableNotoBrown);
        font-size: 90%;
        margin: 0 0 8px 0;
    }
}




/* タブレット */
@media only screen and (min-width:641px) and (max-width: 834px){
}