@charset "utf-8";
html {
  scroll-behavior: smooth;
}

body {
	font-family: "メイリオ";
	margin: 0;
	padding: 0;
	background: #FFF;
}

/* ~~ エレメント / タグセレクター ~~ */
ul, ol, dl { 
	padding: 0;
	margin: 0;
}

li {
	font-family: "メイリオ";
	font-size: 13px;
	list-style-type: none;
	margin: 0;
	padding: 0;
	text-align: justify;
	text-justify: inter-ideograph;
}


li a {
	font-size: 13px;
	-webkit-transition: all 0.3s ease;
	-moz-transition: all 0.3s ease;
	-o-transition: all 0.3s ease;
	transition: all  0.3s ease;
	list-style: none;
	text-decoration: none;
}



h4, h5, h6, p {
	margin-top: 0;	 /* 上マージンを削除すると、マージンを含む div からマージンがはみ出す場合があるという問題を回避できます。残った下マージンにより、後続のエレメントからは離されます。 */
	padding-right: 15px;
	padding-left: 15px; /* div 自体ではなく div 内でエレメントの両側に余白を追加すると、ボックスモデル計算が不要になります。代わりに、両側に余白を指定した div をネストして使用することもできます。 */
}


p {
	font-family: "メイリオ";
	font-size: 13px;
	margin: 0;
	padding: 0;
	text-align: justify;
	text-justify: inter-ideograph;
}


p a { /* このセレクターは、一部のブラウザーでイメージをリンクで囲んだ場合にイメージの周囲に表示される初期設定の青いボーダーを削除します。 */
	font-family: "メイリオ";
	font-size: 13px;
	-webkit-transition: all 0.3s ease;
	-moz-transition: all 0.3s ease;
	-o-transition: all 0.3s ease;
	transition: all  0.3s ease;
}


a img { /* このセレクターは、一部のブラウザーでイメージをリンクで囲んだ場合にイメージの周囲に表示される初期設定の青いボーダーを削除します。 */
	border: none;
}

/* ~~ サイトのリンクのスタイル付けは、ホバー効果を作成するセレクターグループも含め、この順序にする必要があります。~~ */
a:link {
	color:#414958;
	text-decoration: underline; /* 非常に特殊な表示方法でリンクをスタイル付けする場合を除き、一目で見分けられるように下線を指定することをお勧めします。 */
}
a:visited {
	color: #4E5869;
	text-decoration: underline;
}
a:hover, a:active, a:focus { /* このセレクターグループは、キーボードを使用するユーザーに対し、マウスを使用するユーザーと同じホバー効果を提供します。 */
	text-decoration: none;
}

/* ~~ このコンテナが他のすべての div を囲み、パーセンテージに基づいた幅を指定します。~~ */


h1 {
	display: block;
	float: left;
	font-size: 13px;
	margin: 36px 0 0;
	line-height: 20px;
}


/*************************************************************************/
/** スマホ切り換え（PC側） ここから　↓↓↓　*****************************/
/*************************************************************************/
.container .switch {
	text-align: center;
	margin: 20px 0;
	display: none;/**スマホでアクセスしたときのみ表示**/
}


.container .switch a {
	color: #00F;
	text-decoration: underline;
}
/*************************************************************************/
/** スマホ切り換え（PC側） ここまで　↑↑↑　*****************************/
/*************************************************************************/



/** コンテント ここから　↓↓↓　*****************************************************************************************************/

.content {
	width: 1024px;
	height: auto;
	margin: 0 auto;
	padding: 0 0 10px 0;
	background: #FFF;
}


.content .top-img {
	width: 1024px;
	height: 200px;
	margin: 0 0 20px;
	background: url(../../../images-new/program/highschool/nzd/top-img.jpg) no-repeat;
	clear: both;
}


.content .top-img h2{
	display: block;
	float: left;
	width: 1024px;
	font-family: "メイリオ";
	font-size: 40px;
	font-weight: bold;
	color: #FFF;
	line-height: 45px;
	padding: 28px 0 0;
	text-align: center;
}


.content .top-img h3{
	display: block;
	float: left;
	width: 1024px;
	font-family: "メイリオ";
	font-size: 20px;
	color: #FFF;
	line-height: 30px;
	padding: 0;
	text-align: center;
}


.content .top-img p.about {
	display: block;
	float: left;
	width: 359px;
	font-family: "メイリオ";
	font-size: 18px;
	color: #FFF;
	line-height: 30px;
	padding: 30px 0 0 410px;
	text-align: justify;
	text-justify: inter-ideograph;
}



/******************************　main1 ↓↓↓　***************************************************************/
.content .main1 {
    float: right;
	width: 728px;
	margin: 0 0 20px;
    padding: 0;
}

.content .main1 h2 {
    font-size: 30px;
    font-weight: bold;
    text-align: center;
	margin: 15px 0 0;
    padding: 0;
}

.content .main1 h3 {
    font-size: 30px;
    font-weight: bold;
    text-align: center;
	margin: 0;
    padding: 0;
}

.content .main1 h3 span {
    color: #FF0004;
}

.content .main1 p.title {
    font-size: 25px;
    font-weight: bold;
    color: #fff;
    background: #0080FF;
    padding: 10px 0;
    margin: 20px 10px 10px;
    text-align: center;
}

.content .main1 ul {
    margin: 0 10px;
    padding: 0;
}

.content .main1 li.left {
    float: left;
    width: 48%;
    margin: 0;
    padding: 55px 0 0 0;
    background: url("../../program/highschool/images/careerpath/b-arrow.png") center 0 no-repeat;
}

.content .main1 li.right {
    float: right;
    width: 48%;
    margin: 0;
    padding: 55px 0 0 0;
    background: url("../../program/highschool/images/careerpath/b-arrow.png") center 0 no-repeat;
}

.content .main1 li img {
    display: block;
    margin: 0 auto 10px;
    padding: 10px 0 0 0;
    text-align: center;
}


.content .main1 p.left {
    height: 50px;
    font-size: 16px;
    font-weight: bold;
    background: #DFFFD5;
    border: 2px solid #00B200;
    padding: 25px 0 0;
    margin: 0 0 0 10px;
    text-align: center;
        /** 角丸 ******************************/
    border-radius: 5px;        /* CSS3草案 */  
    -webkit-border-radius: 5px;    /* Safari,Google Chrome用 */  
    -moz-border-radius: 5px;   /* Firefox用 */  
}

.content .main1 p.right {
    height: 60px;
    font-size: 16px;
    font-weight: bold;
    background: #FFE7CE;
    border: 2px solid #FF8000;
    padding: 15px 0 0;
    margin: 0 10px 0 0;
    text-align: center;
        /** 角丸 ******************************/
    border-radius: 5px;        /* CSS3草案 */  
    -webkit-border-radius: 5px;    /* Safari,Google Chrome用 */  
    -moz-border-radius: 5px;   /* Firefox用 */  
}

.content .main1 ul {
    margin: 0;
    padding: 0;
    clear: both;
        /** 角丸 ******************************/
    border-radius: 5px;        /* CSS3草案 */  
    -webkit-border-radius: 5px;    /* Safari,Google Chrome用 */  
    -moz-border-radius: 5px;   /* Firefox用 */  
}

/************************************/
.content .main1 ul.point {
    margin: 0 10px;
    padding: 15px 0;
    background: #FFFFBF;
    border: 2px solid #B2B200;
}

.content .main1 ul.point li {
    font-size: 16px;
    margin: 0;
    text-align: center;
}

.content .main1 ul.point li.list {
    margin: 10px 0 10px 250px;
}

.content .main1 ul.point li.list p.red a {
    font-size: 16px;
    font-weight: bold;
    color: #FF0004;
    margin: 0;
    padding: 0;
}

.content .main1 ul.point li.list p.red a {
    font-size: 16px;
    font-weight: bold;
    color: #FF0004;
    margin: 0;
    padding: 0;
}

.content .main1 .img {
    display: block;
    margin: 10px auto;
    padding: 0;
}

/************************************/
.content .main1 ul.after-g {
    margin: 0 10px;
    padding: 15px 0;
    background: #C8E3FF;
    border: 2px solid #0080FF;
}

.content .main1 ul.after-g li.top {
    border-bottom: 1px solid #0180FF;
    margin: 0 10px;
}

.content .main1 ul.after-g li.top p {
    font-size: 16px;
    font-weight: bold;
    text-align: center;
    padding: 0;
    margin: 0 0 10px;
}

.content .main1 ul.after-g li.mid {
    border-bottom: 1px dotted #0180FF;
    margin: 10px 10px;
    padding: 0 0 10px;
}

.content .main1 ul.after-g li.bot {
    margin: 10px 10px 0;
    padding: 0;
}

.content .main1 ul.after-g li.mid p.s-title,
.content .main1 ul.after-g li.bot p.s-title {
    font-size: 16px;
    font-weight: bold;
    color: #FF0004;
    padding: 0;
    margin: 0 0 0 10px;
    text-decoration: underline;
}

.content .main1 ul.after-g li.mid p.text,
.content .main1 ul.after-g li.bot p.text {
    font-size: 13px;
    padding: 0;

    margin: 0 0 0 10px;
    line-height: 125%;
}

.content .main1 ul.after-g li.mid p.align-r {
    font-size: 13px;
    padding: 0;
    margin: 5px 0 0 40px;
    line-height: 125%;
    text-align: right;
}

.content .main1 ul.after-g li.bot p.bold {
    font-size: 13px;
    padding: 0;
    margin: 5px 0 0 10px;
    line-height: 125%;
}

.content .main1 p.box {
    font-size: 20px;
    font-weight: bold;
    color: #FF0004;
    text-align: center;
    padding: 10px 0;
    margin: 0 10px;
    background: #C8E3FF;
    border: 2px solid #0080FF;
        /** 角丸 ******************************/
    border-radius: 5px;        /* CSS3草案 */  
    -webkit-border-radius: 5px;    /* Safari,Google Chrome用 */  
    -moz-border-radius: 5px;   /* Firefox用 */  
}

.content .main1 p.box span {
    display: block;
    font-size: 20px;
    font-weight: bold;
    color: #000000;
    text-align: center;
}

.content .main1 p.link {
    float: left;
    font-size: 18px;
    margin: 10px 30px 0 20px;
}

.content .main1 p.link a {
    color: #0028E3;
    text-decoration: underline;
    font-size: 18px;
    padding: 0;
}






/** コンテント ここまで　↑↑↑　*****************************************************************************************************/