/* Style for PCs */
@media screen and (min-width: 1025px) {
/* Marina Network
-------------------------------------------------------------*/
#mnmm {
    width: 100%;
    height: auto;
    display: block;
}
.mnm {
    display: none!important;
}
#mnintro {
    padding-top: 20px;
    margin-bottom: 0px;
}
#mnintro h2 {
    font-size: 50px;
    font-weight: 700;
    line-height: 1.4em;
    text-align: center;
    color: #333;
    margin-bottom: 10px;
}
#mnintro p {
    font-size: 20px;
    font-weight: 400;
    line-height: 1.6em;
    text-align: center;
    color: #444;
    margin-bottom: 40px;
}
ul#mnint_cc {
    width: 100%;
    max-width: 1400px;
    height: auto;
    display: -webkit-flex;
    display: flex;
    -webkit-flex-wrap: wrap;
    flex-wrap: wrap;
    margin: 0 auto 50px;
}
ul#mnint_cc li {
    width: 48.80%;
    height: auto;
    display: block;
    margin: 0.5%;
    padding: 30px;
	border: solid 1px #222; 
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
    box-shadow: 0px 1px 4px rgba(0,0,0,0.20);
}
ul#mnint_cc li h3 {
    font-size: 24px;
    font-weight: 700;
    letter-spacing: 0px;
    line-height: 1.4em;
    margin-bottom: 5px;
}

#mntitlemm {
    width: 90%;
    height: auto;
    display: block;
    margin: 0 auto;
    text-align: center;
}
.mn_list {
    width: 100%;
    height: auto;
    display: -webkit-flex;
    display: flex;
    -webkit-flex-wrap: wrap;
    flex-wrap: wrap;
    padding: 40px 5%;
    background: rgb(255,255,255);
    background: -moz-linear-gradient(top, rgba(255,255,255,1) 0%, rgba(242,250,255,1) 59%, rgba(226,244,255,1) 100%);
    background: -webkit-linear-gradient(top, rgba(255,255,255,1) 0%, rgba(242,250,255,1) 59%, rgba(226,244,255,1) 100%);
    background: linear-gradient(to bottom, rgba(255,255,255,1) 0%, rgba(242,250,255,1) 59%, rgba(226,244,255,1) 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#e2f4ff', GradientType=0 );
}
.mn_list li {
    width: 32.2333333333333333333%;
    height: auto;
    display: block;
    margin: 0 0.5% 30px;
}
.mn_list li a {
    width: 100%;
    height: auto;
    display: block;
    padding: 25px 25px;
    text-decoration: none;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
    background-color: #fff;
    box-shadow: 0px 1px 4px rgba(0,0,0,0.30);
    -webkit-transition: all 0.4s ease;
    -moz-transition: all 0.4s ease;
    -o-transition: all 0.4s ease;
    transition: all 0.4s ease;
}
.mn_list li a:hover {
    background-color: #f5f5f5;
}
.mn_list li a h2 {
    font-size: 20px;
    font-weight: 700;
    line-height: 1em;
    color: #222;
    letter-spacing: 0px;
    margin-bottom: 10px;
}
.mn_list li a h3 {
    font-family: 'Roboto', sans-serif;
    font-size: 0.8em;
    font-weight: 400;
    line-height: 1em;
    color: #0A5BB0;
    margin-bottom: 10px;
}
.mn_list li a p {
    font-size: 14px!important;
    line-height: 1.6em!important;
    color: #555;
    margin-bottom: 0px!important;
    letter-spacing: 0px;
}
#msp p.pmnpoint {
    width: 80px !important;
    height: 80px !important;
    display: block !important;
    text-align: center !important;
    background-color: #222;
    color: #fff !important;
    font-family: 'Roboto Condensed', sans-serif;
    font-size: 18px !important;
    line-height: 80px !important;
    font-weight: 400 !important;
    margin: 0 auto 10px !important;
    border-radius: 50px;
    -webkit-border-radius: 50px;
    -moz-border-radius: 50px;
    letter-spacing: normal;
}



	/*ユニマットグループバナー*/
	.ug-bn-wrap h2 {
		font-size: 24px;
		font-weight: 100;
		line-height: 1.25em;
		letter-spacing: -0.5px;
		color: #1F546E;
	}
	ul.ug-bn li {
		width: 25%;
		height: auto;
		display: block;
		float: left;
		padding: 0 1% 20px 1%;
	}

}

/* Style for iPad Pro */
@media screen and (min-width: 769px) and (max-width: 1024px) {
/* Marina Network
-------------------------------------------------------------*/
#mnmm {
    width: 100%;
    height: auto;
    display: block;
}
.mnm {
    display: none!important;
}
#mnintro {
    width: 90%;
    height: auto;
    display: block;
    padding-top: 20px;
    margin: 0 auto;
}
#mnintro h2 {
    font-size: 40px;
    font-weight: 700;
    line-height: 1.4em;
    text-align: center;
    color: #333;
    margin-bottom: 10px;
}
#mnintro p {
    font-size: 16px;
    font-weight: 400;
    line-height: 1.6em;
    text-align: center;
    color: #444;
    margin-bottom: 40px;
}
ul#mnint_cc {
    width: 90%;
    height: auto;
    display: -webkit-flex;
    display: flex;
    -webkit-flex-wrap: wrap;
    flex-wrap: wrap;
    margin: 0 auto 50px;
}
ul#mnint_cc li {
    width: 48.80%;
    height: auto;
    display: block;
    margin: 0.5%;
    padding: 30px;
	border: solid 1px #222; 
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
    box-shadow: 0px 1px 4px rgba(0,0,0,0.20);
}
ul#mnint_cc li h3 {
    font-size: 24px;
    font-weight: 700;
    letter-spacing: 0px;
    line-height: 1.4em;
    margin-bottom: 5px;
}

#mntitlemm {
    width: 90%;
    height: auto;
    display: block;
    margin: 0 auto;
    text-align: center;
}
.mn_list {
    width: 100%;
    height: auto;
    display: -webkit-flex;
    display: flex;
    -webkit-flex-wrap: wrap;
    flex-wrap: wrap;
    padding: 40px 5%;
    background: rgb(255,255,255);
    background: -moz-linear-gradient(top, rgba(255,255,255,1) 0%, rgba(242,250,255,1) 59%, rgba(226,244,255,1) 100%);
    background: -webkit-linear-gradient(top, rgba(255,255,255,1) 0%, rgba(242,250,255,1) 59%, rgba(226,244,255,1) 100%);
    background: linear-gradient(to bottom, rgba(255,255,255,1) 0%, rgba(242,250,255,1) 59%, rgba(226,244,255,1) 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#e2f4ff', GradientType=0 );
}
.mn_list li {
    width: 47.90%;
    height: auto;
    display: block;
    margin: 0 1% 15px;
}
.mn_list li a {
    width: 100%;
    height: auto;
    display: block;
    padding: 25px 25px;
    text-decoration: none;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
    background-color: #fff;
    box-shadow: 0px 1px 4px rgba(0,0,0,0.20);
    -webkit-transition: all 0.4s ease;
    -moz-transition: all 0.4s ease;
    -o-transition: all 0.4s ease;
    transition: all 0.4s ease;
}
.mn_list li a:hover {
    background-color: #f5f5f5;
}
.mn_list li a h2 {
    font-size: 20px;
    font-weight: 700;
    line-height: 1em;
    color: #222;
    letter-spacing: 0px;
    margin-bottom: 10px;
}
.mn_list li a h3 {
    font-family: 'Roboto', sans-serif;
    font-size: 0.8em;
    font-weight: 400;
    line-height: 1em;
    color: #0A5BB0;
    margin-bottom: 10px;
}
.mn_list li a p {
    font-size: 14px!important;
    line-height: 1.6em!important;
    color: #555;
    margin-bottom: 0px!important;
    letter-spacing: 0px;
}
p.pmnpoint {
    width: 80px!important;
    height: 80px!important;
    display: block!important;
    text-align: center!important;
    background-color: #222;
    color: #fff!important;
    font-family: 'Roboto Condensed', sans-serif;
    font-size: 18px!important;
    line-height: 80px!important;
    font-weight: 400!important;
    margin: 0 auto 10px!important;
    border-radius: 50px;
    -webkit-border-radius: 50px;
    -moz-border-radius: 50px;
    letter-spacing: normal;
}



	/*ユニマットグループバナー*/
	.ug-bn-wrap h2 {
		font-size: 24px;
		font-weight: 100;
		line-height: 1.25em;
		letter-spacing: -0.5px;
		color: #1F546E;
	}
	ul.ug-bn li {
		width: 50%;
		height: auto;
		display: block;
		float: left;
		padding: 0 1% 20px 1%;
	}

}

/* Style for iPad */
@media screen and (min-width: 481px) and (max-width: 768px) {
/* Marina Network
-------------------------------------------------------------*/
#mnmm {
    width: 100%;
    height: auto;
    display: block;
}
.mnpc {
    display: none!important;
}
#mnintro {
    width: 90%;
    height: auto;
    display: block;
    padding-top: 20px;
    margin: 0 auto;
}
#mnintro h2 {
    font-size: 24px;
    font-weight: 700;
    line-height: 1.4em;
    color: #333;
    margin-bottom: 10px;
}
#mnintro p {
    font-size: 14px;
    font-weight: 400;
    line-height: 1.6em;
    color: #444;
    margin-bottom: 40px;
}
ul#mnint_cc {
    width: 90%;
    height: auto;
    display: -webkit-flex;
    display: flex;
    -webkit-flex-wrap: wrap;
    flex-wrap: wrap;
    margin: 0 auto 50px;
}
ul#mnint_cc li {
    width: 100%;
    height: auto;
    display: block;
    margin: 0 0 30px 0;
    padding: 0 0 30px 0;
    border-bottom: 1px dotted #ccc;
}
ul#mnint_cc li h3 {
    font-size: 20px;
    font-weight: 700;
    letter-spacing: 0px;
    line-height: 1.4em;
    margin-bottom: 5px;
}

#mntitlemm {
    width: 90%;
    height: auto;
    display: block;
    margin: 0 auto;
}
.mn_list {
    width: 100%;
    height: auto;
    display: -webkit-flex;
    display: flex;
    -webkit-flex-wrap: wrap;
    flex-wrap: wrap;
    padding: 40px 5%;
    background: rgb(255,255,255);
    background: -moz-linear-gradient(top, rgba(255,255,255,1) 0%, rgba(242,250,255,1) 59%, rgba(226,244,255,1) 100%);
    background: -webkit-linear-gradient(top, rgba(255,255,255,1) 0%, rgba(242,250,255,1) 59%, rgba(226,244,255,1) 100%);
    background: linear-gradient(to bottom, rgba(255,255,255,1) 0%, rgba(242,250,255,1) 59%, rgba(226,244,255,1) 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#e2f4ff', GradientType=0 );
}
.mn_list li {
    width: 100%;
    height: auto;
    display: block;
    margin: 0 0 15px;
}
.mn_list li a {
    width: 100%;
    height: auto;
    display: block;
    padding: 25px 25px;
    text-decoration: none;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
    background-color: #fff;
    box-shadow: 0px 1px 4px rgba(0,0,0,0.20);
    -webkit-transition: all 0.4s ease;
    -moz-transition: all 0.4s ease;
    -o-transition: all 0.4s ease;
    transition: all 0.4s ease;
}
.mn_list li a:hover {
    background-color: #f5f5f5;
}
.mn_list li a h2 {
    font-size: 20px;
    font-weight: 700;
    line-height: 1em;
    color: #222;
    letter-spacing: 0px;
    margin-bottom: 10px;
}
.mn_list li a h3 {
    font-family: 'Roboto', sans-serif;
    font-size: 0.8em;
    font-weight: 400;
    line-height: 1em;
    color: #0A5BB0;
    margin-bottom: 10px;
}
.mn_list li a p {
    font-size: 14px!important;
    line-height: 1.6em!important;
    color: #555;
    margin-bottom: 0px!important;
    letter-spacing: 0px;
}
p.pmnpoint {
    width: 80px!important;
    height: 80px!important;
    display: block!important;
    text-align: center!important;
    background-color: #222;
    color: #fff!important;
    font-family: 'Roboto Condensed', sans-serif;
    font-size: 18px!important;
    line-height: 80px!important;
    font-weight: 400!important;
    margin: 0 auto 10px!important;
    border-radius: 50px;
    -webkit-border-radius: 50px;
    -moz-border-radius: 50px;
    letter-spacing: normal;
}



	/*ユニマットグループバナー*/
	.ug-bn-wrap h2 {
		font-size: 22px;
		font-weight: 100;
		line-height: 1.25em;
		letter-spacing: -0.5px;
		color: #1F546E;
	}
	ul.ug-bn li {
		width: 50%;
		height: auto;
		display: block;
		float: left;
		padding: 0 1% 20px 1%;
	}

}

/* Style for Smartphone */
@media screen and (max-width: 480px) {
/* Marina Network
-------------------------------------------------------------*/
#mnmm {
    width: 100%;
    height: auto;
    display: block;
}
.mnpc {
    display: none!important;
}
#mnintro {
    width: 90%;
    height: auto;
    display: block;
    padding-top: 20px;
    margin: 0 auto;
}
#mnintro h2 {
    font-size: 24px;
    font-weight: 700;
    line-height: 1.4em;
    color: #333;
    margin-bottom: 10px;
}
#mnintro p {
    font-size: 14px;
    font-weight: 400;
    line-height: 1.6em;
    color: #444;
    margin-bottom: 40px;
}
ul#mnint_cc {
    width: 90%;
    height: auto;
    display: -webkit-flex;
    display: flex;
    -webkit-flex-wrap: wrap;
    flex-wrap: wrap;
    margin: 0 auto 50px;
}
ul#mnint_cc li {
    width: 100%;
    height: auto;
    display: block;
    margin: 0 0 30px 0;
    padding: 0 0 30px 0;
    border-bottom: 1px dotted #ccc;
}
ul#mnint_cc li h3 {
    font-size: 20px;
    font-weight: 700;
    letter-spacing: 0px;
    line-height: 1.4em;
    margin-bottom: 5px;

}
ul#mnint_cc li p {
}
#mntitlemm {
    width: 90%;
    height: auto;
    display: block;
    margin: 0 auto;
}
.mn_list {
    width: 100%;
    height: auto;
    display: -webkit-flex;
    display: flex;
    -webkit-flex-wrap: wrap;
    flex-wrap: wrap;
    padding: 40px 5%;
    background: rgb(255,255,255);
    background: -moz-linear-gradient(top, rgba(255,255,255,1) 0%, rgba(242,250,255,1) 59%, rgba(226,244,255,1) 100%);
    background: -webkit-linear-gradient(top, rgba(255,255,255,1) 0%, rgba(242,250,255,1) 59%, rgba(226,244,255,1) 100%);
    background: linear-gradient(to bottom, rgba(255,255,255,1) 0%, rgba(242,250,255,1) 59%, rgba(226,244,255,1) 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#e2f4ff', GradientType=0 );
}
.mn_list li {
    width: 100%;
    height: auto;
    display: block;
    margin: 0 0 15px;
}
.mn_list li a {
    width: 100%;
    height: auto;
    display: block;
    padding: 25px 25px;
    text-decoration: none;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
    background-color: #fff;
    box-shadow: 0px 1px 4px rgba(0,0,0,0.20);
    -webkit-transition: all 0.4s ease;
    -moz-transition: all 0.4s ease;
    -o-transition: all 0.4s ease;
    transition: all 0.4s ease;
}
.mn_list li a:hover {
    background-color: #f5f5f5;
}
.mn_list li a h2 {
    font-size: 20px;
    font-weight: 700;
    line-height: 1em;
    color: #222;
    letter-spacing: 0px;
    margin-bottom: 10px;
}
.mn_list li a h3 {
    font-family: 'Roboto', sans-serif;
    font-size: 0.8em;
    font-weight: 400;
    line-height: 1em;
    color: #0A5BB0;
    margin-bottom: 10px;
}
.mn_list li a p {
    font-size: 14px!important;
    line-height: 1.6em!important;
    color: #555;
    margin-bottom: 0px!important;
    letter-spacing: 0px;
}
p.pmnpoint {
    width: 80px!important;
    height: 80px!important;
    display: block!important;
    text-align: center!important;
    background-color: #222;
    color: #fff!important;
    font-family: 'Roboto Condensed', sans-serif;
    font-size: 18px!important;
    line-height: 80px!important;
    font-weight: 400!important;
    margin: 0 auto 10px!important;
    border-radius: 50px;
    -webkit-border-radius: 50px;
    -moz-border-radius: 50px;
    letter-spacing: normal;
}



	/*ユニマットグループバナー*/
	.ug-bn-wrap h2 {
		font-size: 22px;
		font-weight: 100;
		line-height: 1.25em;
		letter-spacing: -0.5px;
		color: #1F546E;
	}
	ul.ug-bn li {
		width: 100%;
		height: auto;
		display: block;
		float: none;
		padding: 0 1% 20px 1%;
	}


}