/*------------------------------------------------

 common.css

------------------------------------------------*/


/* html
------------------------------------------------*/

html {
    overflow-y: scroll;
    height: 100%;
}

*{
	box-sizing:border-box;
}

::selection {
    background: #24bab5;
    color: #fff;
}

a:focus, *:focus {
	outline:none;
}

/* body
------------------------------------------------*/

body {
    margin: 0;
    color: #000;
    /*
	font-family: "ãƒ’ãƒ©ã‚®ãƒŽè§’ã‚´ ProN W3", "Hiragino Kaku Gothic ProN", "ãƒ¡ã‚¤ãƒªã‚ª", Meiryo, sans-serif;
	*/
    font-size: 14px;
    text-align: left;
    /*
    line-height: 1.7em;
    height: 100%;
    */
}
.sSP{
	display: none;
}


/* 99% for safari; 100% is too large */

select,
input,
textarea {
	font-family: "ãƒ’ãƒ©ã‚®ãƒŽè§’ã‚´ ProN W3", "Hiragino Kaku Gothic ProN", "ãƒ¡ã‚¤ãƒªã‚ª", Meiryo, sans-serif;
    font: 99%;
}

input[type=text],
input[type=email],
input[type=tel],
textarea {
	background:#f7f7f7;
	border:#D0D0D0 solid 1px;
	border-radius: 4px;
	resize: none;
	padding: 0.3em 1em;
}



/* link
------------------------------------------------*/
#wrap a{
	transition: 0.2s;
}
/*
#wrap a:link {
    color: #000;
    text-decoration: underline;
}

#wrap a:visited {
    color: #000;
    text-decoration: underline;
}
*/
#wrap a:hover,
#wrap a:active {
	/*
    color: #000;

    text-decoration: none;
        */
}




/* img
------------------------------------------------*/

img {
    border: 0;
	vertical-align: middle;
}

a:active img {
    text-decoration: none;
}

a:hover img{
	transition: 0.2s;
}





/* h1, h2, h3, h4, h5, h6
------------------------------------------------*/

h1,
h2,
h3,
h4,
h5,
h6 {
    line-height: 1em;
    margin: 0;
}



/* paragraph
------------------------------------------------*/

div {
    margin: 0;
    /*
    line-height: 1.7em;
    */
}

p {
    margin: 0;
    /*
    line-height: 1.7em;
    */
}


/* list
------------------------------------------------*/

#wrap ul {
    list-style-type: disc;
    margin: 0;
    padding: 0;
}

#wrap ul li {
    margin: 0;
    padding: 0;
    list-style-type: none;
}

#wrap ul.disc li{
	list-style: disc;
	margin-left: 23px;
}

#wrap ul li ul {
    list-style: disc;
    margin: 0;
}

#wrap ol {
    list-style: decimal;
    margin: 0;
    padding-left: 0;
}

#wrap dl {
    margin: 0;
}

#wrap dl dt {
    margin: 0;
    padding: 0;
    line-height: 1.7em;
}

#wrap dl dd {
    margin: 0;
    line-height: 1.7em;
}


/* form
--------------------------------------*/

option {
    padding-left: 0px;
}




/* common rules
================================================*/

/* flex
------------------------------------------------*/

.flexBox{
	display: flex;
}
.sb{
	justify-content: space-between;
}
.jfe{
	justify-content: flex-end;
}
.jcenter{
	justify-content: center;
}
.ac{
	align-items: center;
}
.aend{
	align-items: flex-end;
}
.fwrap{
	flex-wrap: wrap;
}



/* align
------------------------------------------------*/

.right {
    text-align: right;
}

.center {
    text-align: center;
}

.left {
    text-align: left;
}

.middle {
    vertical-align: middle;
}

.bottom {
    vertical-align: bottom;
}

.top {
    vertical-align: top;
}


/* table
------------------------------------------------*/

table {
    border-spacing: 0;
    border-collapse: collapse;
    width: 100%;
}

/* text
------------------------------------------------*/
.f70 {
    font-size: 70px;
}
.f60 {
    font-size: 60px;
}
.f50 {
    font-size: 50px;
}
.f40 {
    font-size: 40px;
}
.f36 {
    font-size: 36px;
}
.f30 {
    font-size: 30px;
}
.f26 {
    font-size: 26px;
}
.f20 {
    font-size: 20px;
}
.f18 {
    font-size: 18px;
}
.f16 {
    font-size: 16px;
}
.f14 {
    font-size: 14px;
}
.f13 {
    font-size: 13px;
}
.f12 {
    font-size: 12px;
    line-height: 1.3em;
}
.f10 {
    font-size: 10px;
    line-height: 1.3em;
}

.bold{
	font-weight: bold;
}



/* margin
------------------------------------------------*/

.mT5 {
    margin-top: 5px;
}
.mT10 {
    margin-top: 10px;
}
.mT15 {
    margin-top: 15px;
}
.mT20 {
    margin-top: 20px;
}
.mT30 {
    margin-top: 30px;
}
.mT40 {
    margin-top: 40px;
}
.mT50 {
    margin-top: 50px;
}



/* float
------------------------------------------------*/

.Lfloat {
    float: left;
}

.Rfloat {
    float: right;
}





/* general layout
================================================*/


/* wrap
------------------------------------------------*/

div#wrap {
	font-family: "ãƒ’ãƒ©ã‚®ãƒŽè§’ã‚´ ProN W3", "Hiragino Kaku Gothic ProN", "ãƒ¡ã‚¤ãƒªã‚ª", Meiryo, sans-serif;
	line-height: 1.7em;
}

.MW1000{
	max-width: 1080px;
	margin: 0 auto;
	padding: 0 40px;
}
.MW1040{
	max-width: 1120px;
	margin: 0 auto;
	padding: 0 40px;
}
.MW1500{
	max-width: 1580px;
	margin: 0 auto;
	padding: 0 40px;
}

.btn{
	position: relative;
	display: block;
}

@media screen and (min-width:768px){
	.btn:before{
		content: "";
		position: absolute;
		top: 0;
		left: 0;right: 0;
		margin: auto;
		width: 100%;
		height: 100%;
		background-color: rgba( 0, 0, 0, 0.2 );
		border-radius: 10px;
		opacity: 0;
		transition: 0.2s;
	}
	.btn:hover:before{
		opacity: 1;
	}
	.class2btn .btn:before,
	.OrangeBtn .btn:before,
	.SpecialPriceBtn .btn:before{
		width: calc(100% - 0.35em);
		height: calc(100% - 0.35em);
	}
	.SpecialPriceBtn .btn:before{
		border-radius: 100px;
	}
}


.tableBox {
	border-radius: 10px 10px 0 0;
	overflow: hidden;
}
.tableBox table{
	table-layout: fixed;
	border: #24bab5 solid 1px;
}
.tableBox table tr th,
.tableBox table tr td{
	text-align: center;
	line-height: 1.3em;
}
.tableBox table tr th{
	background: #24bab5;
	color: #fff;
	border: #fff solid 1px;
	padding: 1em 0.2em;
}
.tableBox table tr th:first-child{
	width: 30%;
	border-left: none;
}
.tableBox table tr th:last-child{
	border-right: none;
}
.tableBox table tr th.orange{
	background: #ff8800;
}
.tableBox table tr td{
	border: #24bab5 solid 1px;
	padding: 1.1em 0.2em;
}
.tableBox table tr td:first-child{
	text-align: left;
	color: #24bab5;
	font-weight: bold;
	padding: 1.1em;
}
.tableBox table tr td p{
	line-height: 1.2em;
}
.tableBox table tr td.orange{
	background: #fffbd9;
	color: #ed1b24;
	font-weight: bold;
}
.tableBox table tr td img{
	max-width: 100px;
}

/* header
------------------------------------------------*/
/*
header{
	background: #fff;
	padding: 10px 0;
}
header .logo{
	width: 140px;
}
header a{
	transition: 0.2s;
	text-decoration: none !important;
}
header a:hover{
	opacity: 0.7;
}
header .toContact{
	font-weight: bold;
}
header .toContact a{
	background: #000;
	color: #fff;
	border-radius: 30px;
	padding: 0.5em 1.5em;
	margin-left: 1.5em;
}
*/




/* gNavi
------------------------------------------------*/




/* footer
------------------------------------------------*/
#footerSNSIcon{
	text-align: center;
	max-width: 500px;
	margin: 0 auto;
	background: #a7e4e2;
	border-radius: 10px;
	padding: 1.5em;
	width: 46.29vw;
}
#footerSNSIcon ul{
	margin-top: 0.7em;
}
#footerSNSIcon ul li{
	max-width: 65px;
	margin: 0 0.5em;
	width: 6vw;
	transition: 0.2s;
}
#footerSNSIcon ul li:hover{
	opacity: 0.7;
}
#footerSNSIcon p {
	color: #000;
}

.FContent,
.FContent a{
	color: #fff;
}
.FContent{
	margin-top: 2.5em;
}

.FContent .logo{
	width: 26.66vw;
	max-width: 288px;
}

#footerYellow{
	background: #ffea3d;
	padding: 0.8em 0;
	padding: 2.5em;
	margin-top: 2em;
}
#footerYellow ul li{
	margin-left: 3em;
}
#footerYellow ul li:first-child{
	margin-left: 0;
}
#footerYellow ul li a{
	text-decoration: none !important;
}
#footerYellow ul li a:hover{
	text-decoration: underline !important;
}

#footer_sub {
	background: #24bbb6;
	padding: 2.5em;
	color: #fff;
}

/* pageTop
------------------------------------------------*/
#TShirtMainMenu{
	width: 100%;
	background: #fff;
	padding: 1.5em 0;
	display: none;
	position: fixed;
	bottom:0;
	left: 0;
	box-shadow: -3px 0 3px #94989d;
	z-index: 100;
}
#TShirtMainMenu .OrangeBtn{
	max-width: 395px;
	margin: 0;
}
#TShirtMainMenu .OrangeBtn:first-child{
	margin-right: 1.2em;
}
.SpecialPriceBtn{
	max-width: 175px;
}


#pageTop {
	position:absolute;
	top:-80px;
	right:50px;
	width:58px;
	height:58px;
	text-align:center;
	box-sizing:border-box;
	z-index: 10000;
	transition: 0.2s;
	cursor: pointer;
}
#pageTop:hover{
	opacity: 0.7;
}

/* btn
------------------------------------------------*/


@media screen and (max-width:1079px){
	.f70 {
		font-size: 6.48vw;
	}
	.f60 {
		font-size: 5.55vw;
	}
	.f50 {
		font-size: 4.62vw;
	}
	.f40 {
		font-size: 3.7vw;
	}
	.f36 {
		font-size: 3.33vw;
	}
	.f30 {
		font-size: 2.77vw;
	}
	.f26 {
		font-size: 2.4vw;
	}
	.f20 {
		font-size: 1.85vw;
	}
	.f18 {
		font-size: 1.66vw;
	}
	.f16 {
		font-size: 1.48vw;
	}
	body,
	.f14 {
		font-size: 1.29vw;
	}
	.f13 {
		font-size: 1.2vw;
	}
	.f12 {
		font-size: 1.11vw;
	}
	.f10 {
		font-size: 0.92vw;
	}

	nav ul li{
		/*
		margin-left: 1em;
		*/
	}

	footer{
		padding-bottom: 14.7em;
	}

	#TShirtMainMenu .OrangeBtn{
		width: 36vw;
	}
	.SpecialPriceBtn{
		width: 15vw;
	}


}



/* SP ã‚¹ãƒžãƒ› */
@media screen and (max-width:767px){
	body {
	    font-size: 14px;
	}
	.sSP{
		display: block;
	}
	.sPC{
		display: none;
	}
	.toCall a{
		text-decoration: underline;
	}

	.spColumn{
		flex-direction: column;
	}
	.dCL{
		flex-direction: column-reverse;
	}

	input[type=text],
	input[type=email],
	input[type=tel],
	textarea {
		width: calc(122% - 2em);
		transform: scale(0.9);
		font-size: 16px;
		outline: none;
		margin-left: -4.5%;
	}

	.MW1000,
	.MW1040,
	.MW1500{
		padding: 0 5%;
	}
	.f70 {
		font-size: 2.571rem;
	}
	.f60 {
		font-size: 2rem;
	}
	.f50 {
		font-size: 4.62vw;
	}
	.f40 {
		font-size: 3.7vw;
	}
	.f36 {
		font-size: 3.33vw;
	}
	.f30 {
		font-size: 1.428rem;
	}
	.f26 {
		font-size: 1.428rem;
	}
	.f20 {
		font-size: 1.285rem;
	}
	.f18 {
		font-size: 1rem;
	}
	.f16 {
		font-size: 1rem;
	}
	body,
	.f14 {
		font-size: 14px;
	}
	.f13 {
		font-size: 0.714rem;
	}
	.f12 {
		font-size: 0.714rem;
	}
	.f10 {
		font-size: 0.571rem;
	}

	/*
	header,
	header .MW1000{
		padding: 0 !important;
	}
	header .logo{
		margin-left: 5%;
		width: auto;
	}
	header .logo img{
		width: auto;
		max-height: 30px;
	}
	header .tel{
		margin-right: 1px;
	}
	header .tel a,
	header .toContact a{
		border-radius: 0;
		font-size: 8px;
		text-align: center;
		display: flex;
		width: 60px;
		height: 60px;
		min-width: 60px;
		min-height: 60px;
		margin: 0;
		padding: 0;
		line-height: 1em;
		justify-content: center;
		align-items: center;
		flex-direction: column;
	}
	header .tel a img,
	header .toContact a img{
		width: 20px;
		display: block;
		margin: 0 auto 1em;
	}
	*/

	#footerSNSIcon{
		width: 100%;
	}
	#footerSNSIcon .f20{
		font-size: 1rem;
	}
	#footerSNSIcon ul li{
		width: 15%;
	}
	.FContent .logo {
	    width: 55%;
	}
	.FContent .mail,
	.FContent .tel{
		text-align: center;
		margin-top: 4%;
	}

	footer {
		padding-bottom: 21%;
	}
	#footerYellow{
		padding: 5% 0;
	}
	#footerYellow ul.flexBox{
		flex-wrap: wrap;
		justify-content: center;
	}
	#footerYellow ul li{
		margin: 0 5% 2% !important;
	}
	#footerYellow #copy{
		margin-top: 3%;
	}

	#pageTop{
		width: 45px;
		height: 45px;
		right: 20px;
		top: -55px;
	}

	#TShirtMainMenu{
		padding: 3% 0;
	}
	#TShirtMainMenu .OrangeBtn{
		width: auto;
	}
	#TShirtMainMenu .OrangeBtn:first-child{
		margin: 0 0 0.5em;
	}
	#TShirtMainMenu .flexBox > .flexBox{
		width: 70%;
	}
	.SpecialPriceBtn{
		width: 25%;
	}

}



@media print{



}

